[英]Countries States and Cities Drop Down
I am new to Ajax and PHP and am encountering problems with a dynamic drop down of states and cities.我是 Ajax 和 PHP 的新手,我遇到了州和城市动态下拉的问题。 Although I have checked whole lot of answers in stackOverflow but I am not able to get a clear picture as to how we should successfully code to get the desired results.
尽管我已经在 stackOverflow 中检查了很多答案,但我无法清楚地了解我们应该如何成功编码以获得所需的结果。
country_back.php
[ Dynamically generates a drop down for states using country_id
] country_back.php
[ Dynamically generates a drop down for states using country_id
]
<?php
$con_id=$_POST['id'];
$con=mysqli_connect("localhost","root","","countries");
$data=mysqli_query($con,"select * from states where country_id='$con_id' ");
echo "<select id='st'>";
while($row=mysqli_fetch_array($data))
{
echo "<option value=".$row['id'].">".$row['name']."</option>";
}
echo "</select>";
?>
ajax file
$("#st").change(function(){
var s=$(this).val();
alert(s); //no value being shown with alert.
$.ajax=({
url:"state_back.php",
method:"post",
data:{stid:s},
dataType:"html",
success:function(strMsg){
$("#city").html(strMsg);
}
})
})
HTML Form
<form method="post">
<div id="city">
<select>
<option>Cities</option>
</select>
</div>
</form>
state_back.php
Dynamically generates a drop down for cities using state_id
state_back.php
Dynamically generates a drop down for cities using state_id
<?php
$stid=$_POST['stid'];
$con=mysqli_connect("localhost","root","","countries");
$data=mysqli_query($con,"select * from cities where state_id='$stid' ");
echo "<select>";
while($row=mysqli_fetch_array($data))
{
echo "<option>".$row['name']."</option>";
}
echo "</select>";
?>
Change your ajax code : 更改您的ajax代码:
$(document).on('change', '#st', function(e){ var s=$('#st').val(); alert(s); //no value being shown with alert. $.ajax({ url:"state_back.php", method:"post", data:{stid:s}, dataType:"html", success:function(strMsg){ alert(strMsg); $("#city").html(strMsg); } }); });
Instead of var s=$(this).val();
而不是
var s=$(this).val();
line try 线尝试
var s=$('#st option:selected').val();
alert(s); 警报;
No need of api just import sql and use this simple code.This is fetching details
from sql database (Only contain indian states and cities).
Most of the cities are available but not sure about all the cities but with this
you can get idea of using select tag.
sql link->https://github.com/Pankaj-singh-tech/indiancities/tree/main
<form method="post">
<select name="state" id="state" onchange="form.submit()" >
<?php
echo "<option value=''>SELECT STATE</option>";
$sql="SELECT * FROM state";
$result=mysqli_query($conn,$sql);
if(!$result){
echo "<option value=''>failed to fetch sates</option>";
}
while($row=mysqli_fetch_array($result)){
echo "<option value='$row[state_id]'
id='state$row[state_id]'>$row[state_title]</option>";
}
if(isset($_POST['state'])){
$state_id=$_POST['state'];
}
?>
</select>
<select name="district" id="district" onchange="form.submit()" >
<?php
echo "<option value=''>SELECT DISTRICT</option>";
$sql2="SELECT * FROM district WHERE state_id='$state_id'";
$result2=mysqli_query($conn,$sql2);
if(!$result2){
echo "<option value=''>failed to fetch district</option>";
}
while($row2=mysqli_fetch_array($result2)){
echo "<option value='$row2[district_id]'
id='district$row2[district_id]'>$row2[district_title]</option>";
}
if(isset($_POST['district'])){
$district_id=$_POST['district'];
}
?>
</select>
<select name="city" id="city" onchange="form.submit()" >
<?php
echo "<option value=''>SELECT CITY</option>";
$sql3="SELECT * FROM city WHERE state_id='$state_id' AND
district_id='$district_id'";
$result3=mysqli_query($conn,$sql3);
if(!$result3){
echo "<option value=''>failed to fetch city</option>";
}
while($row3=mysqli_fetch_array($result3)){
echo "<option value='$row3[city_id]'
id='city$row3[city_id]'>$row3[city_title]</option>";
}
if(isset($_POST['city'])){
$city_id=$_POST['city'];
}
?>
</select>
</form>
<script>
document.getElementById('<?php echo "state$state_id"; ?>').selected =
'selected';
document.getElementById('<?php echo "district$district_id"; ?>').selected =
'selected';
document.getElementById('<?php echo "city$city_id"; ?>').selected =
'selected';
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.