dropdown box in php and javascript - javascript

I am looking for a way to create a drop down list depending on what the user chooses. If the user picks the package of one profile the the output will give the user a drop down list with 1 field if the user chooses two profiles the output will give the user a drop down with 2 fields. The code recently displays just one dropdown even if the user chooses the second option
<ul class="dropdown-menu <?= empty($business) ? 'hidden' : '' ?>" aria-labelledby="business_list">
<?php foreach ($business as $key => $item) : ?>
<li><?= Html::a($item->name, ['social-manager/profiles', 'b' => $key]) ?></li>
<?php endforeach; ?>
</ul>

I will assume you are using jQuery.You will need to define an number variable var length based on user selection. If user selects option 1 then var length=1,if user selects option 2 then var length=2;
Th for loop below should generate the options based on user selection.
for(var x=0;x<length;x++){
.....
}

The best way to do something like this is by creating API endpoint using PHP that will provide the dropdown value and then using ajax to fetch the result and repopulate the dropdown.
The flow would be like;
User select the profile, each time they do trigger a jquery function that will send an ajax to PHP API endpoint with the selected profile(s).
On the API endpoint, check how many profile is selected, return dropdown field value(s) accordingly.
Based on the return value, repopulate the dropdown value using jquery.

Related

Populating datalist takes too long. How to start populating after user enters a few letters in the input field

I have a database table with cities of the world. All in all there are over 100 000 entries. The user should choose via input text field and the datalist one of those entries. Right now I populate the datalist options via PHP:
<input type='text' list='location' placeholder='Location'>
<datalist id='location'>
<?php include("query.php");
while($row = $result->fetch_assoc()) {
echo "<option data-value='". $row['CityName']. "'>". $row['CityName']. "</option>";
};?>
</datalist>
However, due to the large amount of rows it takes too long to load these options. Therefore I would like to start the populating procedure only when the user entered at least 3 letters in the input field (like on this website). But my problem right now is that I don't know how to combine a javascript if clause and the php code as the php is loaded before I can use javascript. How can I create this function like on the mentioned website?
I think that JQuery autocomplete is a complete answer. In particular the "remote datasource" case.

Populate multiple dropdownlists from sql and previous selected value

I have code in php to query database and populate records in a dropdown list which a user will pick. I also have javascript which populates the second dropdown list based on the selection of the first box.
How do I tie these two together so user selects value "x" from dropdown list, and the php will query the database "WHERE.... = SselectedValue"
Are there any examples online? I can't seem to find any.
Write an ajax/phpquery call to second dropdown on change method of first dropdown. Eg-
$("#firstDdwn").on('change',function(){
var val=$(this).val();
//php will query the database "WHERE.... = val"
//on success of data received from query, populate second dropdown
})
Ajax code is supposed to look something like this-
$.ajax(
{
url:"your_controller_URL",
data: val
success:function(result){
//populate 2nd dropdown with result
},
error:function(){
alert("No data received");
}
});
Link for brief info on jquery ajax --- http://www.w3schools.com/jquery/ajax_ajax.asp

Populating drop downs with MySQL entries

I have a MySQL database that contains, amongst other things, 2 tables. One is the events table, containing event names and other details. The other is the instance table. This table links the events table to a venue table and adds a date, so each row is an instance of the linked event.
I am making an event booking form for internal use for these events. I want to allow selection of the event to be booked via a dropdown list. So, I have populated one dropdown with the event names:
$qEvent = "SELECT event_name, event_id FROM events";
$rEvent = mysqli_query($dbc,$qEvent);
echo '<select>';
while ($row = mysqli_fetch_assoc($rEvent)) {
echo '<option value="'.$row['event_id'].'">'.$row['event_name'].'</option>';
}
echo '</select>';
What I now want to do is, for the selected event, grab all the instances associated with that event, and populate another dropdown with the dates.
Can I do this with PHP, or do I need to dip into Javascript? I think I just need some way to grab the event_id value of the dropdown selection and then query based on that, but I don't know how without Javascript.
You should be looking at Javascript or jQuery for achieving your goal. I've used jQuery based on my question to you earlier. It's also simpler and less code.
Your PHP:
Add an ID attribute event_menu to your select menu
echo '<select id="event_menu">';
while ($row = mysqli_fetch_assoc($rEvent)) {
echo '<option value="'.$row['event_id'].'">'.$row['event_name'].'</option>';
}
echo '</select>';
<div id="container_for_new_menu"></div>
Using jQuery:
$('#event_menu').on('change', function() {
// get selected value and build data string for AJAX
var event_selected = "event_selected="+$(this).val();
// send the selected data to a PHP page to build the populated menu
$.ajax({
url : 'populate-menu.php',
type: 'POST',
data : event_selected,
dataType : 'html',
success : function(data) {
$('#container_for_new_menu').html(data);
}, error : function() {
alert("Something went wrong!");
}
});
});
On populate-menu.php, have something like:
$event_selected = isset($_POST['event_selected']) ? $_POST['event_selected'] : null;
// do SQL query here based on user's selection
// making sure you validate the data in the POST request for malicious BS
// or use parameterized queries
// then build a new menu to send back
echo '<select>';
// loop through results and build options
echo '</select>';
This new menu will then be posted back to your original page into the container_for_new_menu element.
By the looks of it, you want to populate the "instances" dropdown based on the selection the user makes on the "event" dropdown. You cannot do this without Javascript.
My suggested way of doing this is to use AJAX to pull the instance data and populate the "instances" dropdown on change of the "event" dropdown. Useful resources below for simple AJAX get with jQuery:
http://api.jquery.com/jQuery.get/
http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/
You need some kind of Javascript to accomplish this. Either:
Basic- submit the form on select and let php populate the instance drop-down.
More elegant- use Javascript to make an Ajax call on select which will dynamically replace the instance drop-down's div.
You will need JavaScript to populate the second drop down box. I suggest you load all the values into JSON on the page and then you can just use a jQuery on change event to populate the second select box.

How to fetch the value from td tag & show this value in a textbox in another page in php?

I have 2 pages Manage.php & edit.php
in manage.php, I have an HTML table created with dynamic data and cannot predict the number of rows in it. Each row has a name column , edit button & delete button.
What i want that when i click on any edit / delete button its corresponding value of name column
should be displayed in textbox in edit page using php????
Thanks in advance
You need to use jquery for this.
Try
$('.buttonclass').on('click', function () {
var column_name= $(this).closest('tr').next().find('input').val();
});
Of course this assumes that the first column is the name column and is looking in to a element.
You can change it to .find('td').html();
You have to bind primary key to the edit and delete button for this particular record, then you have to pass this id/name to the edit page and assign it to that text box. if you are passing only id then you can make select query for selecting name.
try this:
i assume your list is in manage.php:
pass related id and get it into another page.
Edit
Delete
and in edit.php :
<?php
$id = $_REQUEST['id'];
$mode = $_REQUEST['mode'];
if($id !="")
{
if($mode == "edit")
{
//fetch data using id and disply it into your textbox
}
}
?>
and if you want additional security use base64_encode and base64_decode.
example:
<?php
$id = "1";
$encodeid = base64_encode($id);
?>
Edit
and in second page
<?php
$id = $_REQUEST['id'];
$decodeid = base64_decode($id);
?>

How to reference page when I select option value?

I use php code to create one shopping cart. When I click in product page, Since the database have more products that use php code to create product page.
Now, I can ten product in one page. But I need a select box to change product quantity in one page. How can I do for it?
This is my code.
Select Box code.
$content .= "<span style=\"margin-left:50px;color:#BE1E2D;font-size:14px;font-weight:bold;\">show
<select name=\"show_num_select\">
<option value=\"10\">10</option>
<option value=\"20\">20</option>
<option value=\"30\">30</option>
<option value=\"50\">50</option>
<option value=\"100\">100</option>
</select>
item each page</span>";
Read select box value.
$show_num_select = isset($_GET['show_num_select'])?$_GET['show_num_select']:"10";
Create product page. n is product type. Product::count_all is a function.
if(empty($_GET['n'])){
$page = !empty($_GET['page'])? (int)$_GET['page']:1;
$per_page = $show_num_select;
$total_count = Product::count_all(true);
if(empty($_GET['page']) || (int)$_GET['page'] > ceil($total_count / $per_page) ){
$page = 1;
}
Keep a count of current items shown and use it to improve the fetch by querying only for items apart from the ones already rendered. Using ajax fetch the next set of items and render that section. Just a suggestion to avoid fetching all items.
Avoiding page refresh will be good from users point of view.
I don't see where you read the data from the database or another data source. If you use an SQL related data source, use something like:
SELECT id, product_title FROM product LIMIT :start,:end
Where ":start" is the current page number (times) $per_page and ":end" is just $per_page.

Categories

Resources