在PHP和jQuery中,使一个下拉列表依赖于另一个下拉列表
In PHP and jQuery, make one drop-down depend on another drop-down list?
我有两个下拉列表,一个依赖于另一个,如果一个值选择另一个从数据库加载相同的值。例如,如果我选择一个国家,其他加载相同的城市,该国家。
<select name="A" class="input_text" id="A">
<?php
include 'config/config.php';
$sql="SELECT * FROM department ORDER BY Dept ASC";
$result=mysql_query($sql);$options="";
while ($row=mysql_fetch_array($result)){
$did=$row["DeptCode"];
$depts=$row["Dept"];
$options.="<OPTION value='$did'>".$depts;}?>
<option value="0">Select...</option>
<?php echo $options; ?>'
</option>
</select>
<select name="B" class="input_text" id="B">
<?php
include 'config/config.php';
$sql="SELECT * FROM department WHERE DeptCode=$dpttitle";
$result=mysql_query($sql);$options="";
while ($row=mysql_fetch_array($result)){
$did=$row["DeptCode"];
$depts=$row["Dept"];
$options.="<OPTION value='$did'>".$depts;}?>
<option value="0">Select...</option>
<?php echo $options; ?>
</option>
</select>
<script type="text/javascript">
A.onblur = function() {
B.value = this.value;};
</script>
您正在寻找"ajax"功能。尝试使用JQuery查看$.get(url,data,success);
首先,删除dropbox B并将其替换为带有id="B"
$("#A").change(loadCities);
function loadCities(e){
// prepare get statement
var url = "http://www.yoursite.com/ajax/getCities";
var data = {
country : $("#A").val()
};
$.get(url, data, loadCitiesComplete);
}
function loadCitiesComplete(data){
$("#B").html(data);
}
url: "http://www.yoursite.com/ajax/getCities"
php应该看起来像
<?
if(isset($_GET['country'])){
$html = '<select name="B" class="input_text" id="B">';
include 'config/config.php';
$dpttitle = mysql_real_escape_string($_GET['country']);
$sql="SELECT * FROM department WHERE DeptCode=$dpttitle";
$result=mysql_query($sql);$options="";
while ($row=mysql_fetch_array($result)){
$did=$row["DeptCode"];
$depts=$row["Dept"];
$html .="<OPTION value='$did'>".$depts;}?>
$html .= '<option value="0">Select...</option>';
$html .= '</option>';
$html .= '</select>';
echo $html;
}
?>
显然,php应该正确使用国家$_GET变量,使用PDO或mysql与安全准备语句等。但希望这能让你们朝着正确的方向前进。
相关文章:
- 将jsp文件下拉列表中的选定项分配给一个java变量(比如String selection)
- 如何在用户返回和上一个按钮时刷新下拉列表
- 如何为下拉列表的每个选项添加一个属性
- 在Twitter BootStrap嵌套下拉列表中托管一个选择列表(IE 9特定)
- 如何使用jquery将所选项目从一个下拉组列表(optgroup)移动到另一个下拉列表(optgroup)
- 如何强制用户从下拉列表和按钮中选择一个值以启用保存按钮
- 在另一个下拉列表中的选择上切换下拉列表中选项的可见性
- 将onclick事件附加到具有一个元素的下拉列表中
- 引导程序在单击另一个下拉列表时关闭下拉列表
- 如何通过选择下拉列表中的选项从另一个 php 文件中获取数据
- 如何只制作一个下拉列表在单击时下拉
- 通过硒选择一个javascript下拉列表
- 如何在 PHP 中使用 OnChange 事件的下拉列表中选择一个选项后,对大量数据行设置分页
- 如何使用 asp.net 中的另一个下拉列表更改下拉列表选定的索引和可见性
- jQuery - 根据属性在所选选项之后的下拉列表中获取下一个选项的总值
- 如何填充下拉列表,从javascript中的另一个下拉列表中排除任何一个选项
- 选择“第一个下拉列表”以与另一个下拉列表的值相同
- 我创建了一个下拉列表,以及如何显示所选项目的其他列数据
- 导航到另一个页面后,bootstrap下拉列表将不可用
- 使用jquery如何自动删除下拉列表中的第一个空白选项(如果它依赖于另一个选项)