我有一个从数据库填充的选择元素，当我选择一个元素时，我想向我显示与该行相关的另一列中的一些其他数据。
例如: 在下拉菜单中我有: 苹果， 香蕉， 梨子
当我选择苹果时，我想从数据库中选择“总计”列，该列显示我还剩下多少个苹果。
我想，我应该使用Javascript-Ajax？或者是使用 php 执行此操作的另一种方法。
提前致谢!
<?php include("db.php"); ?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
$(document).ready(function() {
$('select').material_select();
});
function myFunction() {
if (document.getElementById('selectid').value == "other") {
var x = document.createElement("INPUT");
x.setAttribute("type", "text");
x.setAttribute("value", "");
x.setAttribute("placeholder", "Write another");
x.setAttribute("class", "input-field col s12");
document.getElementById("myDIV").appendChild(x);
}
}
</script>
</head>
<body>
<div id="myDIV" class="input-field col s4">
<?php
$sql12 = "select * from fruitswhere total>0 && spent=1";
$res1 = mysqli_query($conn, $sql12) or die("Error");
$select = '<select id="selectid" name="name" onchange="myFunction()"><option value = "" disabled selected> Choose </option>';
while($row1 = mysqli_fetch_assoc($res1)) {
$emri = $row1['name'];
// $select.='<option value = "'.$row1['name'].'">'.$row1['name '].'</option>';
$select .= '<option id="my_option" value="'.$name.'">'.$name.'</option>';
}
$select .= '<option value="other">other</option>';
$select .= '</select>';
echo $select;
?>
</div>
<div class="input-field col s4">
<?php
$query2 = "SELECT total FROM fruits WHERE name='$name'";
$res2 = mysqli_query($conn, $query2);
while($row2=mysqli_fetch_assoc($res2)){
$all = $row2['total'];
}
?>
<input name="total" type="number" min="1">
</div>
</body>
</html>
最佳答案
您可以设置一个简单的脚本来响应请求。例如，您可以制作fruitCount.php:
<?php
include('db.php');
$sql = 'SELECT total '.
'FROM fruits '.
'WHERE name="'.mysqli_real_escape_string($_POST['name']).'"';
$result = mysqli_query($conn, $sql);
if ($result != NULL) {
$row = mysqli_fetch_assoc($result);
print($row['total']);
} else {
print(0);
}
die();
然后在页面上，可以使用jQuery设置一个点击事件，向该资源请求数据:
$('#selectid').change(function(){
$.post('fruitCount.php', // Server target for request
{ name: $(this).val() }, // POST payload
function(resp){ // Handle response from server
$('#myDiv').html(resp); // Populate value to page
});
});
这是一种允许在服务器端发生变化的环境中使用最新值的实现。如果您只需要加载时的值，您可以在 OPTION 元素上设置 data-count 属性并从中更新您的 #myDiv:
$('#selectid').change(function(){
$('#myDiv').html($(this).data('count'));
});
如何实现它取决于您希望数据的实时性。
关于javascript - 根据从下拉列表中选择的数据从数据库中选择数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47888017/