As per question I implemented a dynamic form in javscript, which requires that the first option selected within a select matches another in a new select:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Documento senza titolo</title>
<script>
function random_function()
{
var a=document.getElementById("input").value;
if(a==="INDIA")
{
var arr=["Maharashtra","Delhi"];
}
else if(a==="USA")
{
var arr=["Washington","Texas","New York"];
}
var string="";
for(i=0;i<arr.length;i++)
{
string=string+"<option>"+arr[i]+"</option>";
}
string="<select name='any_name'>"+string+"</select>";
document.getElementById("output").innerHTML=string;
}
</script>
</head>
<body>
<select id="input" onchange="random_function()">
<option>select option</option>
<option>INDIA</option>
<option>USA</option>
</select>
<div id="output">
</div>
</body>
</html>
up to here nothing strange, but now I was wondering, having previously created a db, how can I do instead of cities in a static way to implement <?php echo $row_regioni['regione']; ?>?
<select>
<?php do { ?>
<option>
<?php echo $row_regioni['regione']; ?>
</option>
<?php } while ($row_regioni = mysqli_fetch_assoc($regioni)); ?>
</select>
</form>
The code for the html is the following.
<select>
<?php
while(($row = mysqli_fetch_assoc($regioni)) !== null){
print(
"<option value='".htmlentities($row['regione'])."'>".
htmlentities($row['regione']).
"</option>"
);
}
?>
</select>
For passing it to javascript there are multiple solutions. The easiest (which I would not choose because of messing up javascript with php) is:
<?php
$regions = array();
while(($row = mysqli_fetch_assoc($result)) !== null){
array_push($regions, '"'.str_replace('"', '\\"', $row['regione']).'"');
}
?>
<script>regions = [<?php print(implode(",
\t", $regions)); ?>];</script>
This will set the array regions which is then accessable in javascript. You can modify your js code to:
function random_function(){
// ...
var string = "";
for(var i = 0; i < regions.length; i++){
string += "<option value='" + regions[i] + "'>" + regions[i] + "</option>";
}
string = "<select name='any_name'>" + string + "</select>";
//...
}
Your example then looks like this:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Documento senza titolo</title>
<?php
$regions = array();
while(($row = mysqli_fetch_assoc($result)) !== null){
array_push($regions, '"'.str_replace('"', '\\"', $row['regione']).'"');
}
?>
<script>regions = [<?php print(implode(",
\t", $regions)); ?>];</script>
<script>
function random_function(){
var a = document.getElementById("input").value;
var arr;
if(a === "INDIA"){
arr = ["Maharashtra", "Delhi"];
}
else if(a === "USA"){
arr = ["Washington", "Texas", "New York"];
}
var options = "";
for(var i = 0; i < regions.length; i++){
options += "<option value='" + regions[i] + "'>" + regions[i] + "</option>";
}
var select ="<select name='any_name'>" + options + "</select>";
document.getElementById("output").innerHTML = select;
}
</script>
</head>
<body>
<select id="input" onchange="random_function()">
<option>select option</option>
<option>INDIA</option>
<option>USA</option>
</select>
<div id="output">
</div>
</body>
</html>I would prefere to create the select with php. If this is not possible I would use an ajax request to get the values from the database. But I am assuming you are not very familiar with js so I will not post the code for this. Those is advanced techniques.
</div>
You can do something like this
<select id="input">
<option value="">select option</option>
<?php foreach(mysqli_fetch_assoc($regioni) as $region){ ?>
<option value="<?php echo $region['regione']; ?>"><?php echo $region['regione']; ?></option>
<?php } ?>
</select>
If you need set default value for selector, you can compare with some variable or string
<option value="<?php echo $region['regione']; ?>"<?php ($region['regione'] == 'INDIA') ? echo
' selected="selected"' : '' ?>><?php echo $region['regione']; ?></option>