关于datatable的自定义列 并排序的功能

//公共的table的请求方法
function commonDataTables(tableId, url, aoColumns, params, page, sort, aSort, playlength, fn, controlLen) {
    aSort = aSort == null ? [
        [0, "desc"]
    ] : aSort;
    var dataLength = "";
    if (!playlength) playlength = 15;
    $('#' + tableId).show();
    var table = $('#' + tableId).DataTable({
        "bPaginate": page,
        "bFilter": false,
        "bSort": sort,
        "aaSorting": aSort,
        "bServerSide": true,
        "bLengthChange": true,
        "bProcessing" : true,
        "bStateSave": params.length&&params[params.length-1].name == "iDisplayStartflag"?false:true,
        "aLengthMenu": [[15, 30, 60, 100], [15, 30, 60, 100]],
        "iDisplayLength": playlength,
        "sAjaxSource": url,
        "bDestroy": true,
        "bAutoWidth": true,
        "sServerMethod": "POST",
        "aoColumns": aoColumns,
        "scrollX": true,
        "scrollCollapse": true,
        "scrollY":tableId == "risk-table"?false:"600px",
        "sPaginationType": "full_numbers", // 用这个分页的样式是自己设计的
        "fnServerParams": function (aoData) {
            for (var i = 0; i < params.length; i++) {
                aoData.push(params[i]);
            };
        },
        "fnServerData": function (sSource, aoData, fnCallback) {
            $.ajax({
                url: sSource,
                type: "post",
                dataType: isDebug ? "json" : "jsonp",
                jsonp: "callback",
                data: {
                    dt_json: $.toJSON(aoData)
                },
                async: true,
                success: function (records) {
                    var iTotalDisplayRecords = records.iTotalDisplayRecords,iTotalRecords = records.iTotalRecords;
                    if(records.aaData.result){
                        var aaData = records.aaData.result;
                        records={};
                        records.aaData = aaData;
                        records.iTotalDisplayRecords = iTotalDisplayRecords;
                        records.iTotalRecords = iTotalRecords;
                        
                    };
                    try {
                        $('#loading_data').hide();
                      
                        fn && fn(records);
                        fnCallback(records);
                        if (controlLen) {
                            dataLength = records['iTotalRecords'];
                            var pageLen = table.page.len(),
                               pageCount = Math.floor(dataLength / pageLen);
                            if(pageCount>1000){
                                alert('请缩小搜索范围');
                                $('#'+tableId).hide();
                            }
                        }
                    } catch (e) {
                        console.log(e)
                    }

                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(errorThrown);
                }
            });
        },
        "oLanguage": {
            // "sLengthMenu": '每页显示 <select>' + '<option value="15">15</option>' + '<option value="30">30</option>' + '<option value="60">60</option>' + '<option value="90">90</option>' + '</select> 条记录',
            // "sZeroRecords": "暂时木有相关数据",
            // "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
            // "sInfoEmtpy": "找不到相关数据",
            // "sInfoFiltered": "数据表中共为 _MAX_ 条记录)",
            // "sProcessing": "正在加载中...",
            // "sSearch": "搜索",
            // "sUrl": "",
            // "oPaginate": {
            //     "sFirst": "第一页",
            //     "sPrevious": " 上一页 ",
            //     "sNext": " 下一页 ",
            //     "sLast": " 最后一页 "
            // }
        }
    });
    
    return table;
};


//页面调用渲染
var columns = [
        {"title": "ID", "mData": "id"},
        {"title": "类型", "mData": formattype},
        {"title": "名称", "mData":"evname" },
        {"title": "code", mData:'code',createdCell:formatCode},
         {"title": "创建者", "mData": "creator_uid"},
        {"title": "创建时间", "mData": "create_time"},
        {"title": "{{_('table_base_operate')}}", "mData":"id",createdCell: formatOption}
    ];
var url="接口url";
var params = {};  //传的参数
commonDataTables("risk-table", url, columns, params, true, true)


//最后一个true表示table要进行排序，传false表示不排序

在不排序的情况下，我们对列的自定义如 formattype 就可以了，直接定义mData为function
function formattype(data) {
    var str = data['status'] == 1?"启用":"禁用";
    return str;
};

需要排序的情况下，使用上诉方式会报错，原因是该列的关键字段成了一个函数，无法找到

所以我们使用下面的方式进行自定义列的内容 - 要在column中保留mData对应的显示的字段，自定义渲染的内容通过createdCell的方法

function formatCode(cell,celldata,data) {
    var status = data['status'];
    var str = status==0?"初始化":status==1?"试运行":status==2?"进行中":"禁用";
    $(cell).html(str);
};

标签：mData,自定义,records,params,var,table,排序,true,datatable
来源： https://www.cnblogs.com/fyjz/p/13100938.html