我有一个带php的ajax代码和一个SQL,其中我尝试使三个按钮根据值更改“预定”列的名称:是(1),否(0),已取消(2)。 / p>
计划的按钮具有数据目标和数据角色。单击后,将出现一个模态,其中包含三个按钮(是,否,已取消),每个按钮都有其自己的唯一ID用于ajax。
我对ID名称分别具有三个函数,每个函数的var分别为0、1或2。
问题在于这些变量不会触发更新。
我只有2个文件:index.php用于主要代码,connection.php用于数据库链接和sql更新。
模式
数据库(ajax_test)
index.php(表)
<?php
$table = mysqli_query($connection ,'SELECT * FROM user');
while($row = mysqli_fetch_array($table)){ ?>
<tr id="<?php echo $row['id']; ?>">
<td data-target="email"><?php echo $row['email']; ?></td>
<td data-target="scheduled">
<?php
if ($row['scheduled'] == 1) {
?>
<a href="#" data-role="update" data-id="<?php echo $row['id'] ;?>">YES</a>
<?php
} else if ($row['scheduled'] == 0) {
?>
<a href="#" data-role="update" data-id="<?php echo $row['id'] ;?>">NO</a>
<?php
} else if ($row['scheduled'] == 2) {
?>
<a href="#" data-role="update" data-id="<?php echo $row['id'] ;?>">CANCELLED</a>
<?php } ?> </td> </tr> <?php } ?>
index.php(模式弹出窗口)
<!-- Modal-->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content" style="width: 300px; margin: 0 auto;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="form-group">
<a href="#" id="update_yes" class="btn btn-success text-center center-block">YES</a><br>
<a href="#" id="update_no" class="btn btn-danger text-center center-block">NO</a><br>
<a href="#" id="update_cancelled" class="btn btn-warning text-center center-block">CANCEL</a>
</div>
</div>
</div>
</div>
index.php(ajax)
<script>
$(document).ready(function(){
$(document).on('click','a[data-role=update]',function(){
var id = $(this).data('id');
var scheduled = $('#'+id).children('td[data-target=scheduled]').text();
$('#scheduled').val(scheduled);
$('#userId').val(id);
$('#myModal').modal('toggle');
});
$('#update_no').click(function(){
var id = $('#userId').val();
var scheduled = $('0').val();
$.ajax({
url : 'connection.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').text(scheduled);
$('#myModal').modal('toggle');
}
});
});
$('#update_yes').click(function(){
var id = $('#userId').val();
var scheduled = $('1').val();
$.ajax({
url : 'connection.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').text(scheduled);
$('#myModal').modal('toggle');
}
});
});
$('#update_cancelled').click(function(){
var id = $('#userId').val();
var scheduled = $('2').val();
$.ajax({
url : 'connection.php',
method : 'post',
data : {scheduled: scheduled , id: id},
success : function(response){
// now update user record in table
$('#'+id).children('td[data-target=scheduled]').text(scheduled);
$('#myModal').modal('toggle');
} }); }); }); </script>
connection.php
<?php
$connection = mysqli_connect('localhost' , 'root' ,'' ,'ajax_test');
if(isset($_POST['id'])){
$id = $_POST['id'];
$scheduled = $_POST['scheduled'];
$result = mysqli_query($connection , "UPDATE user SET scheduled = '$scheduled' WHERE id='$id'");
}
?>
我想知道ajax函数出了什么问题,我们将不胜感激。
答案 0 :(得分:0)
首先,您可以简单地简化其中的一部分
var scheduled = 0;
您正尝试通过以下方式获取用户ID:
var id = $('#userId').val();
您没有显示任何id =“ userId”的元素
代替使用:
$(this).attr("data-id")
一旦获得了data-id值和模态中的值,就可以使用框值进行ajax调用,并将其传递给连接以更新db记录。