Ajax 更新问题（SQL 和扩展）答案

【问题标题】：Ajax update issues (SQL and extensions)Ajax 更新问题（SQL 和扩展）
【发布时间】：2019-04-08 06:55:17
【问题描述】：

我有一个 ajax 更新功能，但有一些具体问题，我相信这只是需要一些调整才能 100% 解决。

我将尽可能清楚地总结以下问题。

我有两个相互交互的文件：

orders.php
orders-claimed.vc.php

我的 ajax 正在尝试根据单击的按钮更新表格 int 值。否=0，是=1，取消=2。

orders.php

页面开始

    <?php
      session_start();
      require_once('orders-claimed.vc.php');
     ?>

按钮的表格列：

               <td data-target="scheduled">
                 <input id='userId' type='hidden'/>
                 <?php
                   if ($rowOrder['scheduled'] == 1) {
                  ?>

                  <a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-success">YES</button></a>

                 <?php
               } else if ($rowOrder['scheduled'] == 0) {
                   ?>
                  <a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-danger">NO</button></a>
                 <?php
               } else if ($rowOrder['scheduled'] == 2) {
                   ?>
                  <a href="#" data-role="update" data-id="<?php echo $rowOrder['orderid'] ;?>"><button class="btn-warning">CANCELLED</button></a>
                 <?php
                   }
                  ?>
               </td>

用于与表格交互的模态

   <!-- 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>

ajax 代码

<script>
    $(document).ready(function(){

  //  append values in input fields
    $(document).on('click','a[data-role=update]',function(){
          var id  = $(this).data('id');
          var scheduled  = $('#'+id).children('td[data-target=scheduled]').text();

          $('#userId').val(id);
          $('#myModal').modal('toggle');
    });

    // now create event to get data from fields and update in database

    $('#update_no').click(function(){
       var id  = $('#userId').val();
       var scheduled = 0;

       $.ajax({
           url      : 'orders-claimed.vc.php',
           method   : 'post',
           data     : {scheduled: scheduled , id: id},
           success  : function(response){
                         // now update user record in table
                          $('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-danger">NO</button></a>');
                          $('#myModal').modal('toggle');

                      }
       });
    });

    $('#update_yes').click(function(){
       var id  = $('#userId').val();
       var scheduled = 1;

       $.ajax({
           url      : 'orders-claimed.vc.php',
           method   : 'post',
           data     : {scheduled: scheduled , id: id},
           success  : function(response){
                         // now update user record in table
                          $('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-success">YES</button></a>');
                          $('#myModal').modal('toggle');

                      }
       });
    });

    $('#update_cancelled').click(function(){
       var id  = $('#userId').val();
       var scheduled = 2;

       $.ajax({
           url      : 'orders-claimed.vc.php',
           method   : 'post',
           data     : {scheduled: scheduled , id: id},
           success  : function(response){
                         // now update user record in table
                          $('#'+id).children('td[data-target=scheduled]').html('<a href="#"><button class="btn-warning">CANCELLED</button></a>');
                          $('#myModal').modal('toggle');

                      }
       });
    }); }); 
 </script>

请注意，以上所有代码都在同一个文件（orders.php）中

表格列界面

模态

SQL 表名“订单”

这些是我在页面中的扩展。大多数都存储在一个文件夹中并被链接。

   <script src="../_lib/v/jquery.slim.min.js"></script>

   <script src="../_lib/v/bootstrap/js/bootstrap.js"></script>

   <script src="../_lib/v/jquery-ui/jquery-ui.js"></script>

   <script src="../_lib/v/jscolor/jscolor.js"></script>

   <script src="js/cms.js"></script>

   <link href="../_lib/v/bootstrap/css/bootstrap.min.css" rel="stylesheet">

Ajax 在 slim.min.js 下不起作用，出现“not a function error”，所以我从https://code.jquery.com/jquery-3.3.1.js改成了普通版的jquery

问题

如果我切换到完整版的 jquery，列会更新，但会话（登录用户）结束并自动注销。为什么会这样？

我的第二个问题是在 orders-claimed.vc.php 文件中

db.php

<?php

class config_db {

  public function init() {
    $db = new PDO('*MY DATABASE DETAILS GO HERE*');

    date_default_timezone_set('Hongkong');
    return $db;
  }

}

?>

orders.claimed.vs.php

连接数据库：

   $routePath = "../";

   require_once($routePath . "_config/db.php");
     $dbConfig = new config_db();
     $db = $dbConfig->init();

SQL 更新

 if(isset($_POST['id'])){

  $orderid = $_POST['id'];
  $scheduled = $_POST['scheduled'];

  $stmt = $db->prepare("UPDATE order SET scheduled = '$scheduled' WHERE orderid = '$orderid'");
  $stmt->execute(); }

问题

上面的 SQL 代码不会更新表格（屏幕截图中显示的那个，但 ajax 只是从成功函数更新按钮的外观（当页面刷新时它会恢复到原来的值）。我想要知道是什么问题。它应该连接到按钮，因为它使用“if(isset($_POST['id']))”。

我希望我已经对我的两个问题提供了清晰的解释，谢谢你的帮助。

更新我使用下面的代码来检查按钮更新的错误：

console.log( 'scheduled: ' + scheduled + ' orderid: ' + $('#userId').val() );

当按钮更新并且页面刷新也注销会话时，我收到以下错误：

jquery-ui.js:1951 Uncaught TypeError: Cannot read property 'step' of undefined
    at String.<anonymous> (jquery-ui.js:1951)
    at each (jquery.slim.min.js:2)
    at Function.color.hook (jquery-ui.js:1913)
    at jquery-ui.js:1963
    at jquery-ui.js:2005
    at jquery-ui.js:14
    at jquery-ui.js:16

【问题讨论】：

我找不到 ID 为“已调度”的 HTML 元素。你能指出我在哪里吗？而且，关于您的第一个问题，您在检查时是否在控制台中发现任何错误？
scheduled 用于数据目标和变量，在我的第一个问题中我的控制台中没有错误。用户刚刚退出。
没有。当你说“#scheduled”时，它意味着有一个 ID 为“scheduled”的 HTML 元素。你有这样的元素吗？？
我的错，忘了把它拿出来，那个代码是多余的。更新了问题。
让我们continue this discussion in chat。

标签： javascript php jquery sql ajax

【解决方案1】：

根据您列出的内容，我认为您的 php 文件中的某处可能有“session_destroy()”（尽管它可能不会放在这里）。尝试将其注释掉，看看会话是否结束。希望对你有帮助:)。

【讨论】：