通过onchange从php过滤数据
Filtering datalist by onchange from php
我是javascript初学者
我有选择组件,包含类的列表和输入,其中包含数据表name
在mysql
<select class="form-control" name="class" id="class" onchange="" value="--">
<option>--</option>
<option>X NET 1</option>
<option>X NET 2</option>
<option>XI NET 1</option>
<option>XI NET 2</option>
</select>
<input type="text" class="form-control" name="name" id="name" list="checkName" autocomplete="off" required>
<datalist id="checkName">
<?php
$sql_siswa = "SELECT name,class from student order by name;";
$result = $conn->query($sql_siswa);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()){
echo "<option value='"".$row["name"]."'">";
}
}
?>
</datalist>
所以,我想如果我选择类,datalist将检索名称学生类从过滤器通过php。这里像这样过滤:
$sql_siswa = "SELECT name from student where class like '".$_POST["class"]."' order by name;";
$result = $conn->query($sql_siswa);
if ($result->num_rows > 0){
while($row = $result->fetch_assoc()){
echo "<option value='"".$row["name"]."'">";
}
}
如何在onchange
中实现此过滤器?对不起,我什么都没尝试过,因为我不知道该怎么做。
您应该尝试使用ajax
<select class="form-control" name="class" id="class" onchange="ajax_change(this.value)" >
<option value="">--</option>
<option value="X NET 1">X NET 1</option>
<option value="X NET 2">X NET 2</option>
<option value="XI NET 1">XI NET 1</option>
<option value="XI NET 2">XI NET 2</option>
</select>
function ajax_change(str){
$.ajax({
type: 'POST',
url: 'ajax.php',
data: {class: str},
success: function (data) {
$("#checkName").html(data);
},
error: function (xhr) {
//Do Something to handle error
alert("some error found");
}
});
}
在ajax.php
//include connection
if(isset($_POST["class"])){
$sql_siswa = "SELECT name from student where class like '".$_POST["class"]."' order by name;";
$result = $conn->query($sql_siswa);
if ($result->num_rows > 0){
while($row = $result->fetch_assoc()){
echo "<option value='"".$row["name"]."'">";
}
}
}
相关文章:
- 通过API调用过滤数据
- 如何在D3.js中绘制地图投影上的点,并使用范围滑块过滤数据
- 如何使用javascript、jquery或其他javascript框架过滤数据
- 在解析时使用变量过滤数据
- 如何用使用剔除数据和“数据”两者计算的数据来过滤数据;外部“;数据
- d3在鼠标悬停上过滤数据之后从选择中提取值
- AngularJS-显示过滤数据的长度
- 如何在 Angular js 中按日期过滤数据
- 如何在数组循环中过滤数据
- Javascript - 使用文本输入框过滤数据
- 如何在数组循环 222 中过滤数据
- 基于动态复选框过滤数据 角度 JS中的类别
- 从数组 java 脚本中过滤数据
- Angular JS 搜索过滤器不会使用 Firebase 过滤数据
- 如何在 Angular js 中根据严格匹配过滤数据
- JQuery - 使用不同输入的多个筛选器过滤数据属性
- 如何在angularjs中按日期范围过滤数据
- 如何在角度js中使用日期过滤数据
- 如何在Angular js中基于两个自定义过滤器过滤数据
- Asp.net MVC 3过滤数据然后传递到JSON中