在ajax更新或插入調用后如何更新/刷新數據表？

Question

我這里有此表，該表由數據庫查詢結果填充：

<div class="card-block">
    <table id="catTbl" class="display" width="100%" cellspacing="0"  data-toggle="modal" data-target="#cat-update">
         <thead>
             <tr>
                 <th>ID</th>
                 <th>Title</th>
             </tr>
         </thead>
         <tbody>
             <?php
                 include "../processes/getLists.php";
                 $process = new getLists();
                 $process->getCatForTbl();
                 //used PHP PDO for that
             ?>
         </tbody>
      </table>
      <p id="message" style="margin-top: 15px"></p>
</div>

我可以使用ajax在數據庫中正確更新和插入行，因此該頁面不會在以后的每個過程中加載，但是問題是，如果在每次插入/更新之后我都沒有重新加載頁面，那么數據表將不會使用新更新的/插入的行。

我嘗試了$("#catTbl").ajax.reload() ， $("#catTbl").clear().draw()但除非我的表以某種方式由json組成，否則它們將無法工作。 在ajax調用之后，我能做些什么來重新加載表嗎？ 補充：我不希望整個頁面重新加載，而只是提交事件時的數據表。

$('#updateCatForm').on("submit", function(event){
    event.preventDefault();
    $.ajax({
        url:"../ajax/updateCat.php",
        method:"POST",
        data:$('#updateCatForm').serialize(),
        success:function(data){
            $('#updateCatForm')[0].reset();
            $('#cat-update').modal('hide');
            $('#message').html(data);
            //I put the table reload solutions here and nothing seemed to work :<
        }
    })
});

Answer 1

用這個

$('#example').DataTable().ajax.reload();

確保選擇器相同。 或者您可以簡單地存儲在變量中並像這樣使用它

var table = $('#example').DataTable();

然后在ajax之后

table.ajax.reload();

- -編輯 - -

table.ajax.reload({
    "ajax": {
           "url": '${ctx}/work/list_ajax.json',
           "type": 'POST',
           "data":{ 
              data:$('form').serialize()
           }
    } 
});

我對此不太確定，我沒有嘗試過，但這是獲取數據並顯示在表上的方法。 抱歉，我無法為您提供有效的代碼段。 記住返回的數據應采用正確的格式，否則將無法正常工作。