我知道还有很多其他主题基于此主题。我的代码基于其中一个。它很好用。唯一的问题是它是一个 2 级下拉菜单。我需要添加另一个下拉菜单,以便完成我的国家、地区、城市列表。
如果您可以查看我的代码并建议我如何添加第 3 个下拉列表(城市),那就太好了。
index.php
<html>
<head>
<script>
function showHint(str) {
var xmlhttp;
if (str.length==0) {
document.getElementById("regiondiv").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("regiondiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax.php?country="+str,true);
xmlhttp.send(null);
}
</script>
</head>
<body>
<div class="field">
<label for="cat">Country</label>
<select id="country" name="country" onChange="showHint(this.value);" required >
<option value="0">--Select Country--</option>
<?php
$getCountry = DB::getInstance()->query("SELECT * FROM countries");
if(!$getCountry->count()) {
echo 'No Country found!';
} else {
foreach($getCountry->results() as $row) {
$country_id = escape($row->countryId);
$country_name = escape($row->countryName);
?><option value="<?php echo $country_id; ?>" ><?php echo $country_name; ?></option><?php
}
}
?>
</select>
</div>
<label for="cat">Region</label>
<div id="regiondiv">
<select name="region" id="region">
<option>--Select State--</option>
<option></option>
</div>
</body>
</html>
ajax.php
<?php require_once 'core/init.php';
$country_id = escape(Input::get('country'));
$select_region = DB::getInstance()->get('regions', array('countryId', '=', $country_id));
if(!$select_region->count()) {
echo 'No Country found!';
} else {
?><select name="region" id="region"><?php
foreach($select_region->results() as $row) {
$region_id = escape($row->regionId);
$region_name = escape($row->regionName);
?><option value="<?php echo $region_id; ?>" ><?php echo $region_name; ?></option><?php
}
?></select><?php
}
最佳答案
我真的不明白你的问题?您基本上是在问如何为城市再次为地区做您现在正在做的事情?
就像创建一个 cityAjax.php:
<?php require_once 'core/init.php';
$region_id = escape(Input::get('region'));
$select_city = DB::getInstance()->get('citys', array('regionId', '=', $region_id));
if(!$select_city->count()) {
echo 'No City found!';
} else {
?><select name="city" id="city"><?php
foreach($select_city->results() as $row) {
$city_id = escape($row->cityId);
$city_name = escape($row->cityName);
?><option value="<?php echo $city_id; ?>" ><?php echo $city_name; ?></option><?php
}
?></select><?php
}
对不起,你的问题没有意义......
更新:
啊,我想我明白你的问题了。您不了解如何让生成的区域选择加载城市部分。
好的,你可以这样做:
如上文所述,您首先需要为检索城市的逻辑创建一个新的 ajax.php。从一个文件处理所有内容会更好,但为了简单起见,我们只使用第二个 php 文件。
您还需要扩展基本 html 文件并为城市添加占位符:
... 地区 --选择州--
<label for="cat">Cities</label> <div id="citydiv"> <select name="city" id="city"> <option>--Select State--</option> <option></option> </div>
...
您还需要添加一个 javascript 函数来填充这个新的占位符:
:
function showHint(str) {
...
xmlhttp.open("GET","ajax.php?country="+str,true);
xmlhttp.send(null);
...
}
function showCity(str) {
var xmlhttp;
if (str.length==0) {
document.getElementById("citydiv").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
} else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("citydiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","cityAjax.php?region="+str,true);
xmlhttp.send(null);
}
: - 最后但同样重要的是,您需要扩展现有的 ajax.php 代码,以便在选择区域时调用新的 javascript 函数:
...
?><select name="region" id="region" onChange="showCity(this.value);" required><?php
foreach($select_region->results() as $row) {
$region_id = escape($row->regionId);
$region_name = escape($row->regionName);
?><option value="<?php echo $region_id; ?>" ><?php echo $region_name; ?></option><?php
}
?></select><?php
...
希望对您有所帮助!
关于php - 我需要帮助完成这个 3 级动态下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22888777/