刷新Jquery datatable而不进行页面刷新

Question

我有一个jquery datatable，它表示数据库表值.I，m通过一个json方法填充这个表行。

现在我从数据表中删除一行意味着，所有的数据表功能，如排序和筛选，都不起作用，我刷新页面，意味着它工作正常。我的猜测是删除的行不会在DOM中更新。我也尝试了fndraw fndestroy函数，但是没有用..

请提供刷新数据表的任何解决方案。

谢谢，我的代码是

function LoadOrderDetails() {

        $.ajax({
            type: "POST",
            url: "MyDataVer1.aspx/LoadOrderDetails",
            contentType: "application/json",
            dataType: "json",
            success: function(data) {
                $('#TblOrderDetails').find('tbody').remove();

                var TableHTML = "";
                TableHTML = TableHTML + "<tbody>";
                for (var i = 0; i < data.d.length; i++) {
                    if (i % 2 == 0) {
                        // do if even
                        TableHTML = TableHTML + "<tr id='GVDRow" + i + "' class='odd'>";
                    }
                    else {
                        // do if not
                        TableHTML = TableHTML + "<tr id='GVDRow" + i + "' class='even'>";
                    }

                    //TableHTML = TableHTML + "<tr id='GVDRow" + i + "'>";
                    TableHTML = TableHTML + "<td id='Sno'>";
                    TableHTML = TableHTML + data.d[i].Sno;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='Date'>";
                    TableHTML = TableHTML + data.d[i].Date;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='BadgeID'>";
                    TableHTML = TableHTML + data.d[i].BadgeID;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='ConsultantName'>";
                    TableHTML = TableHTML + data.d[i].ConsultantName;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='ManagerName'>";
                    TableHTML = TableHTML + data.d[i].ManagerName;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='GeoGraphy'>";
                    TableHTML = TableHTML + data.d[i].GeoGraphy;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='Country'>";
                    TableHTML = TableHTML + data.d[i].Country;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='Segment'>";
                    TableHTML = TableHTML + data.d[i].Segment;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='SubSegment'>";
                    TableHTML = TableHTML + data.d[i].SubSegment;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='OrderType'>";
                    TableHTML = TableHTML + data.d[i].OrderType;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='CaseNumber'>";
                    TableHTML = TableHTML + data.d[i].CaseNumber;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='OrderNumber'>";
                    TableHTML = TableHTML + data.d[i].OrderNumber;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='OrderStatus'>";
                    TableHTML = TableHTML + data.d[i].OrderStatus;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='Reason'>";
                    TableHTML = TableHTML + data.d[i].Reason;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td id='Comments'>";
                    TableHTML = TableHTML + data.d[i].Comments;
                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td>";
                    TableHTML = TableHTML + "<input id='btnEdit" + i + "' type='image' style='border-width:0px;'   onclick='javascript:return FnEditOrder(" + data.d[i].AutoID + "," + i + ");'  src='images/editicon.gif' class='btnedit' ></input>";


                    TableHTML = TableHTML + "</td>";
                    TableHTML = TableHTML + "<td>";
                    TableHTML = TableHTML + "<input id='btnDelete" + i + "' type='image' style='border-width:0px;' onclick='javascript:return FnDeleteOrder(" + data.d[i].AutoID + ");' src='images/Delete_Img.png' ></input>";

                    TableHTML = TableHTML + "</td></tr>";

                }
                TableHTML = TableHTML + "</tbody>";




                var oTable = $('#TblOrderDetails').DataTable();
                oTable.fnClearTable();
                oTable.fnDraw();
                ('#TblOrderDetails').DataTable();
            },
            error: function() {
                alert("Failed to load order status");
            }
        });

Answer 1

刷新数据表而不重新加载页面

var oTable = $('#TblOrderDetails').DataTable();
oTable.draw();