DataTables如何重新加载数据

DataTables加载数据

// 调用ajax请求数据
g.ajax("/srp/data", data, function (jsonStr) {
    // setValue为table的tbody动态生成tr，并渲染数据
    setValue(JSON.parse(jsonStr));
    // 初始化DataTables
    var table = $('#datatable-buttons8').DataTable({
        // DataTables的配置属性：http://www.datatables.club/reference/option/
        lengthChange: false,
        buttons:  ['copy', 'excel', 'pdf']
    });
    table.buttons().container()
        .appendTo('#datatable-buttons8_wrapper .col-md-6:eq(0)');
}, null, null);

DataTables重新加载新数据

// 再次调用ajax请求新数据
g.ajax("/srp/data", data, function (jsonStr) {
    // 清空DataTables数据
    $("#datatable-buttons8").dataTable().fnClearTable();
    // 销毁旧的DataTables对象，以便初始化新的DataTables
    $("#datatable-buttons8").dataTable().fnDestroy();
    // 动态生成tr，并渲染数据
    setValue(JSON.parse(jsonStr));
    // 照常初始化DataTables
    var table = $('#datatable-buttons8').DataTable({
        // DataTables的配置属性：http://www.datatables.club/reference/option/
        lengthChange: false,
        buttons:  ['copy', 'excel', 'pdf']
    });
    table.buttons().container()
        .appendTo('#datatable-buttons8_wrapper .col-md-6:eq(0)');
}, null, null);

附上动态生成tr的代码：

// setValue根据clsName的不同进入setTableValue
function setTableValue(clsName, jsonStr) {
    var table = $("." + clsName + " tbody");
    // 在此之前可以清空所有旧的tr
    table.empty();
    var data = jsonStr[clsName];
    for (var i = 0; i < data.length; i++) {
        // 生成tr
        var $trTemp = $("<tr></tr>");
        var obj = data[i];
        var keys = Object.keys(obj);
        var attrCount = keys.length;
        for (var j = 0; j < attrCount; j++) {
            // 生成td
            $trTemp.append("<td>"+ obj[keys[j]] +"</td>");
        }
        $trTemp.appendTo(table);
    }
}

DataTables更多属性介绍：

http://www.datatables.club/reference/option/

https://www.cnblogs.com/xiashengwang/p/8087181.html

DataTables国际化示例：

https://blog.csdn.net/qq_22690445/article/details/79682311