jQuery dataTable 列的自定义排序 [英] Custom Sorting of jQuery dataTable Columns

问题描述

我有一个包含数字和 NA 列的表格.

I have a table which contains columns of numbers and NA.

<tr>
    <td>NA</td>
</tr>
<tr>
    <td>1024</td>
</tr>
<tr>
    <td>100</td>
</tr>
<tr>
    <td>200</td>
</tr>
<tr>
    <td>300</td>
</tr>
<tr>
    <td>2096</td>
</tr>

我正在尝试使用 jQuery dataTable 对列进行排序以生成以下内容:

I'm trying to use jQuery dataTable to sort the column to produce the following:

NA、100、200、300、1024、2096 和 2096、1024、300、200、100、NA

但无法通过阅读排序和插件文档来弄清楚如何做到这一点.

but can't figure out how to do it from reading the sorting and plugins docs.

我在这里创建了一个代码小提琴:http://jsfiddle.net/stowball/rYtxh/ 和非常感谢您的帮助.

I've created a Fiddle of the code here: http://jsfiddle.net/stowball/rYtxh/ and would really appreciate some assistance.

推荐答案

通过查看带有 HTML 插件的数字，您可以使用现有代码并修改正则表达式以查找负数而不是剥离所有内容.使用它，您可以将NA"周围的 HTML 标记放在一起，并使用 HTML5 数据内部 ID 来存储集合的最低编号.

By looking at the Numbers with HTML plugin you can take the existing code and modify the regex to look for negative numbers instead of stripping everything. Using that you can put together a HTML tag around the "NA" and use the HTML5 data-internalid to store the lowest number of the collection.

于是变成:

<td><a data-internalid="-1">NA</a></td>

和(注意正则表达式)

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"num-html-pre": function ( a ) {
    var x = String(a).replace(/(?!^-)[^0-9.]/g, "");
    return parseFloat( x );
},

"num-html-asc": function ( a, b ) {
    return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},

"num-html-desc": function ( a, b ) {
    return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}});

然后在datatable中，设置类型为num-html

Then in the datatable, set the type to num-html

$('table').dataTable({
    "aoColumns": [{ "sType": "num-html" }],
    "aaSorting": [[ 0, "desc" ]],
});

您可以在此处查看我的完整解决方案:http://jsfiddle.net/rYtxh/4/

You can see my full solution here: http://jsfiddle.net/rYtxh/4/

这篇关于jQuery dataTable 列的自定义排序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！