填充第二个<选择>基于第一个<select>下拉选项
Populate second <select> drop down based on the first <select> drop down option
我试图根据第一个选择的下拉选项填充第二个下拉列表。
这是我到目前为止的工作:
form.php -我使用javascript调用getgeneral.php。当用户从(第一个)下拉菜单中选择:
时,将显示第二个下拉菜单。<html>
<head>
<script type="text/javascript">
function get_states() { // Call to ajax function
var classitem = $('#classitem').val();
var dataString = "classitem="+classitem;
$.ajax({
type: "POST",
url: "getgeneral.php",
data: dataString,
success: function(html)
{
$("#get_general").html(html);
}
});
}
</script>
</head>
<body>
<form action="" method="POST">
<?php
include('conn.php');
$result=mysqli_query($con,"SELECT * FROM classtable");
?>
<select id="classitem" name="classitem" onchange="get_states();">
<option value=''>Select</option>
<?php
while ($row = mysqli_fetch_array($result)) {
echo "<option value='" . $row['genclasscode'] . "'>" . $row['description'] . "</option>";}
?>
</select>
<div id="get_general"></div>
</form>
</body>
</html>
这是getgeneral.php,它将根据第一个下拉列表获取数据:
<?php
include('conn.php');
if ($_POST) {
$classitem = $_POST['classitem'];
if ($classitem != '') {
$result1=mysqli_query($con,"SELECT * FROM generalclass WHERE genclasscode='$classitem'");
echo "<select name='classitem'>";
echo "<option value=''>Select</option>";
while ($row = mysqli_fetch_array($result1)) {
echo "<option value='" . $row['specclassid'] . "'>" . $row['description'] . "</option>";}
echo "</select>";
}
else
{
echo '';
}
}
?>
PROBLEM: 第二个下拉列表不会显示。当我运行form。php
很抱歉太晚回答这个问题。
问题是我忘记在我的代码中包含jQuery。我像这样包含jQuery,在<head> </head>
部分之间:
<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.4.custom/css/custom-theme/jquery-ui-1.10.4.custom.min.css">
<script src="jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
感谢Bryan和Chitowns24在上面的评论。
相关文章:
- 根据select选项元素将表单重定向到不同的URL
- jQuery动态表单显示在select选项上
- 如何在触发事件后选择select选项
- jQuery:根据select选项中的每页项目进行分页
- 使用JavaScript删除多个select选项
- 使用select选项转换时间.使用javascript
- 使用angularjs解析JSON,并选择select选项
- 使用jQuery在select选项上设置HTML数据属性
- 如何防止onclick事件在select选项中触发
- 如何在angular js中的select选项中获取所选项目id
- ng-select 选项在与自定义指令一起使用时加倍
- jQuery未能将JSON数据附加为select选项
- 如何将html中select选项的输入与javascript一起使用
- 使用VueJs获取Select选项文本
- 从jquery中的select选项添加两个不同的数组值(text&value)
- select选项在angularjs中不显示
- jQuery v 1.1x更改select选项的值
- 将select选项添加到id中
- 基于select选项的javascript动态表单生成
- Select选项包含在验证模型MVC时不起作用