如何为多个按钮分配ajax变量答案

【问题标题】：how to assign ajax variables for multiple buttons如何为多个按钮分配ajax变量
【发布时间】：2019-08-22 04:26:29
【问题描述】：

我有一个带有 php 和 SQL 的 ajax 代码，我试图让三个按钮根据值更改“预定”列的名称：是 (1)，否 (0)，取消 (2)。

计划按钮具有数据目标和数据角色。单击后，会出现一个模式，其中包含三个按钮（是、否、取消），每个按钮都有自己的唯一 ID，可在 ajax 中使用。

我有三个函数，每个函数的 id 名称也都有 0、1 或 2 的 var。

问题是这些变量不会触发更新。

我只有两个文件：主要代码的index.php和数据库链接和sql更新的connection.php。

表格输出

模态

数据库（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">&times;</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>

连接.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 函数有什么问题，任何帮助将不胜感激。

【问题讨论】：

您是否检查了您的控制台，您的控制台中显示了哪些错误？
$('#scheduled').val(scheduled); $('#userId').val(id);这两行需要 'scheduled' 和 'userId' 元素，我在 index.php 中找不到这些元素。这些元素是否是 index.php 的一部分（此处未发布）？
控制台没有错误，ajax是index.php的一部分
你能在 ajax 调用之前插入 console.log( 'scheduled: ' + scheduled +', id:' + id ) 以查看这些值是否正确更新？还有一个 id 为 'userId' 的元素吗？
让我们continue this discussion in chat。

标签： php sql ajax

【解决方案1】：

首先，您可以将其中的一部分简化为简单

var scheduled = 0;

您正在尝试通过以下方式访问用户的 id：

var id  = $('#userId').val();

您没有显示任何带有 id="userId" 的元素

改为使用：

$(this).attr("data-id")

一旦您从模态框获取了 data-id 值和值，您就可以使用框值进行 ajax 调用并将其传递给连接以更新数据库记录。

【讨论】：