如何仅使用数据表中的现有数据重绘使用服务器端处理的数据表？

Question

我正在尝试根据行的某些属性的值从使用服务器端处理（删除行数据和 row/tr 可视化）的 Datatable 中删除一行.

我正在使用 remove() 函数执行此操作，它删除了行数据，但在视觉上 table 仍然相同。

所以我添加了 draw() 函数，但它重新初始化 table，包括数据。

那么，在从使用服务器端处理的 Datatable 中删除一行后，我如何 "redraw" table？是否有任何其他功能，如 draw() 重绘 table 但仅使用数据 table 中的现有数据？

 $("#tableSelector").DataTable()
     .rows( function ( idx, data, node ) {
         return data.attribute_value == value_to_delete;
     } )
     .remove()
     .draw();

Answer 1

终于，我找到了解决办法。我关注了 this thread then read about the DataTable's property "dataSrc".
Then with this information searched for something similar in Stack Overflow and found .
所以做我要求的技巧是使用一个变量来过滤我想在 ajax 调用中忽略的行。

我重新使用了中提供的代码。这是结果：

HTML:

<table id="example" class="display" cellspacing="0" width="100%">
     <thead>
         <tr>
           <th>Name</th>
           <th>Email</th>
           <th>Subject</th>
           <th>Status</th>
           <th>Message</th>
           <th>Details</th>
         </tr>
        </thead>
 </table>

JS:

$(document).ready(function() {
    function loadDataTable(excluded_name = undefined){
        $("#example").DataTable().destroy();
      $('#example').DataTable({
         // "processing" : true,
          "ajax" : {
              "url" : "https://api.myjson.com/bins/12uwp2",
               "dataSrc": (json) => {
               if(excluded_name !== undefined){
                return json.filter((item) => item.name !== excluded_name)
               }else{
                return json
               }
              }
          },
          "columns" : [ {
              "data" : "name"
          }, {
              "data" : "email"
          }, {
              "data" : "subject"
          }, {
              "data" : "status"
          },{
              "data" : "message"
          },
          {
             "mData": "Details",
             "mRender": function (data, type, row) {
                      return "<a class='delete' data-name='"+ row.name + "' data-id=" + row.id + " href='/Details/" + row.id + "'>Delete</a>";
                  }
          }]
      });
    }
    $(document).on("click", ".delete", function(e) {
        e.preventDefault()
        let excluded_name = $(this).data("name")
        alert("Excluding this name in the next load: " + excluded_name);
        loadDataTable(excluded_name);
    })
    loadDataTable();
});

Fiddle: https://jsfiddle.net/ek94mh1x/4/

注意：这是客户端 "delete"，我知道这可以通过服务器端处理来完成，但在我的情况下，我只被允许在客户端进行。
此外，如果您需要删除多行，您可以使用数组作为参数并遵循相同的逻辑。
我希望这可以帮助某人。

如何仅使用数据表中的现有数据重绘使用服务器端处理的数据表？

How to redraw a Datatable that uses server side processing using only the existing data in the datatable?

javascript

jquery

server-side

datatables