从jquery DataTables中的渲染中删除一行

时间:2015-08-23 16:33:40

标签: jquery datatables

如果在初始化期间遇到条件,我想跳过行渲染,但是我不知道究竟放在哪里。

我应该把它放在fnCreatedRow还是fnPreDrawCallback? 我怎么能这样做?

这是我的代码:

 var users_tbl =$('#users_tbl');
    users_tbl.DataTable({
        "deferRender": true,
        "autoWidth": false,
        //for reinitialisation purpose
        destroy: true,
        "aLengthMenu": [[20, 40, 50, 100, -1], [20, 40, 50, 100, "All"]],
        "order": [[ 0, "DESC" ]],
        "ajax" : {
                url :  Main.Vars.host + "settings/get_users",
                type : "GET",
            },
            "aoColumnDefs": [

                    { "sWidth": "5%", "aTargets": [ 0 ] },
                    { "sWidth": "20%", "aTargets": [ 1 ] },
                    { "sWidth": "25%", "aTargets": [ 2 ] },
                    { "sWidth": "15%", "aTargets": [ 3 ] },
                    { "sWidth": "5%", "aTargets": [ 4 ] },
            ],
           "fnCreatedRow"  : function( nRow, aData, iDataIndex ){
                $(nRow).addClass('item-context');   

               return false;
            },
            "fnPreDrawCallback": function( oSettings ) {
                console.log(oSettings);
            },
            "columns": [
                { 
                    "data": "id",
                },
                { 
                    "data": "username",
                },  
                {
                   "render": function(data,type,row,meta) {
                        var owner = row.pnp_info.first_name + " " + row.pnp_info.last_name;
                        return owner;
                   }  
                },
                {
                    "data": "created_on",   

                },
                {
                   "render": function(data,type,row,meta) {
                        return row.active == 1 ? "YES" : "NO";
                   }  
                },

            ],

            sPaginationType: "full_numbers",
    });

1 个答案:

答案 0 :(得分:5)

对于fnCreatedRow来说为时已晚,对于fnPreDrawCallback,您最终取消了对表格的渲染。你有两种不同的方式:

1 ajax.dataSrc回调中的清理JSON:

var table = $('#example').DataTable( {
    ajax : {
        url : 'test.json',
        dataSrc: function(json) {
            var rows = [];
            for (var i=0;i<json.data.length;i++) {
                //skip rows "if a condition is met"
                //here just any rows except row #1
                if (i>0) rows.push(json.data[i]);
            }
            return rows;
        }
    }
    ....
})    

2 )在xhr事件后清理JSON:

table.on('xhr.dt', function (e, settings, json, xhr) {
    //manipulate the json directly, no return needed
    //delete row #1, same as above
    json.data.splice(0,1);
});

两个例子都假设你在(简化)表格

上有很好的JSON
{
 "data": [
     {
       "id": "2423",
       "username" : "joe"
     },
     {
       "id": "4321",
       "username" : "gordon"
     }
  ]
}