当“无数据”存在时，对行进行不同的排序

Question

我以相当标准的方式使用DataTables插件。这是ready事件内容：

jQuery('#languages_table').DataTable({ 
    pageLength: 100, 
    columns: [ 
     { orderDataType: "dom-text" }, 
     { orderDataType: "dom-text" }, 
     { orderDataType: "dom-text" }, 
     { orderDataType: "dom-text", type: "num" }, 
     { orderable: false }, 
     { orderable: false } 
    ] 
    }); 

然而，在某些情况下，细胞没有资料，所以我需要显示类似没有数据。

这显然与排序系统（特别是数字列）混乱，排序他们在不需要的地方。

我已经设法通过将电池完全耗尽摆脱这个问题，为数字（所以没有写没有数据在所有），并加入由CSS文本：

#languages_table td:empty::before { 
    content: "no data"; 
} 

这样单元格计数为零，下降搜索，它们出现在最底部（因为以这种方式排序数字更有用）。

这很糟糕（并且翻译很痛苦），但它确实有效。

我现在需要相同的文本单元格，但在这种情况下，排序应该将空单元格放在上升搜索的底部（在这种情况下更有趣），我当然不知道如何要做到这一点。

有没有办法手动处理这些边缘情况？

Answer 1

您需要自定义排序功能。您可以将其范围限定为您定义的自定义类型。

$.extend($.fn.dataTableExt.oSort, { 
    "null-last-pre": function (a) { 
     // Preprocess data if you need to. Currently doing nothing 
     return a; 
    }, 

    "null-last-asc": function(a, b) { 
     return (a===null)-(b===null) || +(a>b)||-(a<b); 
    }, 

    "null-last-desc": function(a,b) { 
     return (a===null)-(b===null) || -(a>b)||+(a<b); 
    } 
}); 

然后在添加columnDefs到你的选择是这样的：从您的列定义，并且只要数据为“null”或“：

columnDefs: [ 
    { type: 'null-last', targets: [0,1,2,3,4,5] } 
] 

同时删除了“‘民’类型”未定义“，那么它应该适当地分类。如果你需要'num'类型的类型转换，那么只需从目标数组中删除'3'即可。不确定哪种类型优先（columnDef或列）。