Javascript 显示选择框中的数据而不单击按钮
我已经做好了,但不知怎么的,它停止了工作。我想在不点击按钮的情况下显示数据库中与选择框中所选数据相关的信息,所以我使用了ajax 按钮Approve Clearance用于显示数据后我希望使用的另一个操作 有一个带有id记录的div,它是隐藏的,并将在显示数据时显示Javascript 显示选择框中的数据而不单击按钮,javascript,php,ajax,Javascript,Php,Ajax,我已经做好了,但不知怎么的,它停止了工作。我想在不点击按钮的情况下显示数据库中与选择框中所选数据相关的信息,所以我使用了ajax 按钮Approve Clearance用于显示数据后我希望使用的另一个操作 有一个带有id记录的div,它是隐藏的,并将在显示数据时显示 <div class="card-body"> <form id="gform" action="action/actionclearance.php" method="POST"> <l
<div class="card-body">
<form id="gform" action="action/actionclearance.php" method="POST">
<label>Student ID</label>
<select id="stud_id" name="stud_id" class="form-control col-md-6" required>
<option selected="selected">Select Student ID</option>
<?php
$mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
$resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0");
while( $rows = mysqli_fetch_assoc($resultset) ) {
?>
<option><?php echo $rows["stud_id"]; ?></option>
<?php } ?>
</select>
<br>
<a href="action/actionclearance.php?gclear=<?php echo $rows["stud_id"]; ?>"><button type="submit" class="btn btn-primary btn-md" name="gclear" id="gclear" class="gclear"><i class="fas fa-check-double"></i> Approve Clearance</button></a>
</form>
</div>
<div class="card-footer">
<div id="display">
<div class="row" id="heading" style="display:none;">
<tr>
<th class="text-center">
<div class="col-sm-6">
<strong>Student</strong>
</div>
</th>
</tr>
</div>
<div class="row" id="records">
<tr>
<td>
<div class="col-sm-6">
<span id="stud_fname"></span>
<span id="stud_mname"></span>
<span id="stud_lname"></span>
<span id="stud_suffix"></span>
</div>
</td>
</tr>
</div>
<div class="row" id="no_records">
<div class="col-lg-12 text-center">
Plese select Student ID to view details</div>
</div>
</div>
</div>
</div>
下面是我用来显示数据而不点击按钮的ajax代码
<script>
$(document).ready(function(){
// code to get all records from table via select box
$("#stud_id").change(function() {
var id = $(this).find(":selected").val();
var dataString = 'stud_id='+ id;
$.ajax({
url: 'getstudent.php',
dataType: "json",
data: dataString,
cache: false,
success: function(studentData) {
if(studentData) {
$("#heading").show();
$("#no_records").hide();
$("#stud_fname").text(studentData.stud_fname);
$("#stud_mname").text(studentData.stud_mname);
$("#stud_lname").text(studentData.stud_lname);
$("#stud_suffix").text(studentData.stud_suffix);
$("#records").show();
} else {
$("#heading").hide();
$("#records").hide();
$("#no_records").show();
}
}
});
});
});
</script>
这是连接到数据库的getstudent.php,ajax从中获取要显示的数据
<?php
include("../configAdmin.php");
if($_REQUEST['stud_id']) {
$mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
$resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0 AND stud_id ='".$_REQUEST['stud_id']."'");
while( $rows = mysqli_fetch_assoc($resultset) ) {
$data = $rows;
}
echo json_encode($data);
} else {
echo 0;
}
?>
不使用ajax,您就可以做到这一点
<select id="stud_id" name="stud_id" class="form-control col-md-6" required>
<option selected="selected">Select Student ID</option>
<?php
$mysqli = new mysqli ('localhost', 'u220931635_arug', 'Smarvcdsl2019', 'u220931635_arug') or die (mysqli_error($mysqli));
$resultset = mysqli_query($mysqli, "SELECT * FROM tbl_student where delete_flag = 0");
while( $rows = mysqli_fetch_assoc($resultset) ) {
?>
<option value="<?php echo $rows["stud_id"]; ?>"><?php echo $rows["stud_id"]; ?></option>
<?php } ?>
</select>
警告:您完全可以使用参数化的预处理语句,而不是手动生成查询。它们由或提供。永远不要相信任何形式的输入!即使您的查询仅由受信任的用户执行。