ajax调用的dataTables更改数据答案

【问题标题】：dataTables Change Data for ajax callajax调用的dataTables更改数据
【发布时间】：2016-11-24 21:23:00
【问题描述】：

我正在使用以下函数从服务器加载包含数据的 DataTables 表。我想在单击事件上使用不同的参数重新加载表格，但我无法弄清楚如何做到这一点。如果我调用 reload 它只是用原始参数重新加载如果我重新初始化整个表它会抛出一个错误，因为表已经存在。

我一直在研究 fnServerParams，但不知道它是否有帮助。

如果有人能指出我正确的方向，那就太好了。

function LoadRiskProfileModalTable(userId, teamId, riskProfileClass) {

var params = {
    userId: userId,
    teamId: teamId,
    riskProfileClass: riskProfileClass
};

var data = JSON.stringify(params);
//if (!$.fn.DataTable.isDataTable("#riskProfileTable")) {

    var table = $("#riskProfileTable").DataTable({
        "bProcessing": true,
        "sAjaxSource": "WFMHome.aspx/GetRiskProfileDrillThroughDatatable",
        "fnServerData": function (sSource, aoData, fnCallback) {
            //aoData.push(JSON.stringify(params));
            $.ajax({
                "dataType": 'json',
                "contentType": "application/json; charset=utf-8",
                "type": "POST",
                "url": sSource,
                "data": data,
                "success": function (msg) {
                    var json = jQuery.parseJSON(msg.d);
                    fnCallback(json);
                    $("#riskProfileTable").show("fast", function () { $('#riskProfileTableLoading').hide("fast") });
                },
                error: function (xhr, textStatus, error) {
                    if (typeof console == "object") {
                        appendAlert("errorAlertPlaceholder", xhr.responseText, 1, "danger");
                        console.log(xhr.status + "," + xhr.responseText + "," + textStatus + "," + error);
                    }
                }
            });
        },
        "columns": [
            { "data": "CaseHandler" },
            { "data": "caseAreaText" },
            { "data": "RiskProfileText" },
            { "data": "PassChecks" },
            { "data": "F1Checks" },
            { "data": "F2Checks" },
            { "data": "F3Checks" },
            { "data": "CurrentChecks" }
        ]
    });
//} 
//else {
//        $('#riskProfileTable').DataTable().ajax.reload();
//    }
};

【问题讨论】：

目前我已经通过在函数中销毁、删除和附加表定义来解决我的直接问题。不过我想要一个更优雅的解决方案。

标签： javascript jquery .net ajax datatables

【解决方案1】：

如果你只是想用来自服务器的数据替换你现在拥有的数据，尝试将成功方法替换为：

"success": function (msg) {
    var json = jQuery.parseJSON(msg.d); //I assume it's the data set
    var table = $("#riskProfileTable").DataTable();
    table.rows.clear(); //clear the current data
    table.rows.add(json).draw();
    $("#riskProfileTable").show("fast", function () { $('#riskProfileTableLoading').hide("fast") });
},

【讨论】：