We Keep Coding

Populate dropdown2 from onChange event of dropdown1

I need to write a code where i need to populate a dropdown1 from mysql table based on the selection of another dropdown which also where in need to give values of dropdown as numeric value as item id from mysql table , but script.js not accepting any numeric value .Am quite new to this concept please help me to resolve this issue, thank you
HTML PART
<div>
<select class="custom-select" style="width: 150px;" id="dropdown1" onchange="onChange()">
<option selected disabled>Select Role </option>
<?php
enter code here
$sql = "SELECT * FROM category";
$result = $conn->query($sql);
//Populate dropdown2 from onChange event of dropdown1
if ($result->num_rows > 0){
// output data of each row
while($row = $result->fetch_assoc()){
echo "<option class='dropdown-item' value='".$row["id"]."'>".$row["name"]."</option>";
}
} else{
echo "Sorry No Role Availabe for Now";
}
$conn->close();
?>
</select><br/>
<span id="choosen"></span>
</div>
JS PART
<script>
function onChange(){
var idforquery =document.getElementById('dropdown').value;
document.getElementById("choosen").innerHTML="
// Here we generate another dropdown of behalf of selected dropdown option
<div>
<select class="custom-select" style="width: 150px;" id="dropdown1">
<option selected disabled>Select Role </option>
<?php
$sql2 = "SELECT * FROM sub_category WHERE cat_id =idforquery;";
$result = $conn->query($sql2);
if ($result->num_rows > 0){
// output data of each row
while($row = $result->fetch_assoc()){
echo "<option class='dropdown-item' value='".$row["id"]."'>".$row["name"]."</option>";
}
} else{
echo "Sorry No Role Availabe for Now";
}
$conn->close();
?>
</select><br/>
<span id="choosen1"></span>
</div>";
}
</script>

This is not going to work. PHP code is only executed when the client loads the page. If you want the <option> tags to change dynamicaly after the page has loaded, you need to use an asynchronous request (AJAX).
Here is a guide on how to use AJAX requests using PHP and jQuery.

how to display data on combo box in edit form

i choose a data from combo box on insert form and stored in database ..
then i want to display that data on edit form but if i want to change the data i can choose from combo box again..can you help me? thank you
this code on my edit form:
<select class="select" name="category">
<option>Choose Category</option>
<?php
require_once './db_freelancer.php';
$get_data = mysqli_query($mysqli, "select * from project_category");
while($category = mysqli_fetch_array($get_data)){
echo " <option value=".$category['category_id'].">".$category['category_name']."</option>";
}
?>
</select>

you can try below code....Edit this code as per your data structure
$member_category = $memberdata['category_id']; // Retrieve member's category from database.
<select class="select" name="category">
<option>Choose Category</option>
<?php
require_once './db_freelancer.php';
$get_data = mysqli_query($mysqli, "select * from project_category");
while($category = mysqli_fetch_array($get_data)){
echo '<option value="'.$category['category_id'].'" '.(($category['category_id']==''.$member_category.'')?'selected="selected"':"").'>'.$category['category_name'].'</option>';
} ?>
</select>

how to hide original dropdown list in select2

I want to use select2 for my dropdown list. The options are from a database query. What I got is there are two dropdown lists showing. The first one is the original dropdown and the second is using select2.
The select code is:
<select name="city" id="select-city" class="form-control">
<option></option>
<?php foreach ($cities as $ct) : ?>
<option value="<?php echo $ct->id ?>"><?php echo $ct->name ?></option>
<?php endforeach; ?>
</select>
And the javascript is:
<script>
$(document).ready(function () {
$("#select-city").select2();
});
</script>
I want to hide the original dropdown. How can I do this?

Update/Edit a form, so that it loads with selected option-values of SELECT from sql table

Here, I have already submitted my form values in sql table, with a multiple select, where I serialized selected values of <options> & inserted in SQL column : fldR.
Now, I am trying to UPDATE this form info, and trying to load this form.php, with fetched values from SQL table. I want to populate the MULTIPLE select, with fetched - selected option values.
PHP:
$data = mysqli_fetch_object($result);
$selected_values = unserialize($data->fldR);
Now what to do ?
HTML / PHP:
<select name="rtype[]" id="rtype" class="myselect" multiple="multiple" style="height:6em">
<option value="hr">H1</option>
<option value="fr">F1</option>
<option value="rnr">R1</option>
</select>
Any creative ideas how this can be done?

We can use in_array() to check if the value is in array or not, if yes execute certain code.
in_array() can accepts two arguments, first argument is the value you need to check and second parameter is array to be checked.
Now update your PHP/HTML code as below to select the values in SELECT box by default from databases. Like this,
<select name="rtype[]" id="rtype" class="myselect" multiple="multiple" style="height:6em">
<option value="hr" <?php if(in_array('hr',$selected_values)) { ?> selected="selected" <?php } ?>>H1</option>
<option value="fr" <?php if(in_array('fr',$selected_values)) { ?> selected="selected" <?php } ?>>F1</option>
<option value="rnr" <?php if(in_array('rnr',$selected_values)) { ?> selected="selected" <?php } ?>>R1</option>
</select>
http://php.net/manual/en/function.in-array.php

Dynamically populate 3 dropdowns based on the selection in first dropdown

I have 4 dropdowns. Magazines, DD1, DD2, DD3. The dropdowns DD1, DD2, DD3 needs to be auto populated dynamically with the selection of a value in Magazine dropdown. The dropdowns DD1, DD2, DD3 are not dependent on each other. They purely depend on value in Magazines dropdown.
On the selection of dropdown 1 value, php ajax has to make call on mysql. I need to implement 3 different mysql queries in the background for 3 dropdowns.I surfed in net and all dropdowns are related to the previous dropdowns. For Example.
Can anybody guide me with proper link or proper idea to do this.

A quick workaround using javascript onchange:
form:
<select name="dd1" id="dd1" class="form-control" onChange="getDD2(this.value);">
<option value="" selected="selected">-select-</option>
</select>
javascript:
function getDD2(id){
if(id==""){
alert("Please select any dd1!");
}else{
var url = 'getdd2.php?id='+id;
$('#dd2container').load(url);
}
}
and in getdd2.php
$id = $_REQUEST['id'];
$dd= "SELECT * FROM prefix_dd2 WHERE id='$id'";
$founddd1 = $dbh->query($dd);
$res = $founddd1->fetchAll();
if(count($res)<=0){
echo '<select name="dd2" class="form-control" id="dd2">';
echo '<option value="select">No dd</option>';
echo "</select>";
}else{
echo '<select name="dd2" class="form-control" id="dd2" onchange="getDD3($id)">';
echo '<option value="select" selected="selected">-select-</option>';
foreach($res as $dd2):
echo '<option value="'.$dd2['id'].'">'.$dd2['dd2_name'].'</option>';
endforeach;
echo "</select>";
}
DD2 select in your form would be:
<div id="dd2container">
<select name="dd2" class="form-control">
<option value="" selected="selected">--select--</option>
</select>
</div>
Now you can make getDD3() function like I did getDD2() above. I hope this may help.
If you want to populate three select at one go, you can put all the three select box in the getdd2.php and query the database for each base on the data from the first select box.