javascript - 如何从 UI 中的数据表中删除行，尽管我可以使用 Ajax 调用成功地从服务器中删除

Question

我有一个数据表，在每一行我都有一个删除按钮。在单击删除时，我正在进行 ajax 调用并通过传递 id 从服务器中删除该行。

但是在 ajax 调用成功时，该行不会从 UI 的表中删除。

下面是代码。

我已经渲染了删除列

{
                 "data": "Action","orderable": false, "render": function(data, type, row) {
                     userSignum=readCookie("userSignum");
                    var userIDMGroups=readCookie("nfvDBGroups");
                    var userIDMGroupsArray=userIDMGroups.split(';')
                    if((jQuery.inArray(userIDMGroups,userIDMGroupsArray ) !== -1)&&(row['signumId'] == userSignum) )
                    {
                        return '<button  class="btn btn-action deleterecord" id="'+row.id+'">Delete</button>'
                    }
                    else
                    {
                        return '<button  class="btn btn-action deleterecord" id="'+row.id+'" disabled="disabled">Delete</button>'}
                    }          

             }

下面是 ajax 调用

 $("#searchTable tbody").on("click", ".deleterecord", function () {
         var table = $('#searchTable').DataTable();    
        var recordId=$(this).attr("id");  
          // var $row = $(this);
           if(recordId!=null){
               $.ajax({
                    type: 'POST',
                    url: config.vnfURL + 'vnf/delete',
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",                 
                    data : JSON.stringify({"id" : recordId }),
                    processData: false,
                    success: function(response, textStatus, jqXHR) {
                        // table.row( $(this).parents('tr') ).remove().draw();
                        //$(recordId).remove(); 
                        table.row($(this).parents('tr')).remove().draw(false);
                         alert("record deleted");
                         if(jqXHR.status == "200"){
                             className = "alert-success";
                             msg = "Record has been deleted Successfully.";
                      } else {
                             className = "alert-danger";
                             msg = "Something wrong, please try again after sometime.";
                      }
                      $("#infoDiv").addClass(className).show();
                      $("#infoDiv>center>p").html(msg);
                      setTimeout(function() { 
                             $("#infoDiv").removeClass(className).hide();
                             $("#infoDiv>center>p").html("");
                            // window.location = "/resources/search.html";
                      }, 7000); 
                    },

请帮忙

标签： javascriptjquerydatatables

Answer 1

在ajax的成功回调中添加这一行

table.row( $(this).parents('tr') ).remove().draw();