如何对jQuery DataTables中的数字列进行排序

时间:2013-03-06 21:27:09

标签: javascript jquery html datatables

(看了一堆关于这个主题的答案,这些都不适用于这个问题。)

DataTables具有让用户点击每列的向上/向下三角形图标以按升序或降序排序的功能。我已按如下方式加载数据

        oTable.fnAddData( ["Bogus data","1,541,512","12.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","3,541,512","2.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","541,512","1.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","2,541,512","32.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","741,512","3.5%","0","0","0"]);
        oTable.fnAddData( ["A Bogus data","41,512","1.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","2,541,512","12.5%","0","0","0"]);
        oTable.fnAddData( ["Z Bogus data","1,541,512","12.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","3,541,512","2.5%","0","0","0"]);
        oTable.fnAddData( ["La Bogus data","541,512","1.5%","0","0","0"]);
        oTable.fnAddData( ["The Bogus data","2,541,512","32.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","741,512","3.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","41,512","1.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","2,541,512","12.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","1,541,512","12.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","3,541,512","2.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","541,512","1.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","2,541,512","32.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","741,512","3.5%","0","0","0"]);
        oTable.fnAddData( ["Bogus data","41,512","1.5%","0","0","0"]);

在第2列中,当我单击向上/向下三角形时,数字值将按字母顺序处理。如何调整它以使第二列向上/向下箭头以正确的方式触发,将字符视为数字。我尝试使用以下初始化:

oTable = $('.utable').dataTable( {
"aoColumns": [{ sWidth: '60%' },{sWidth: '30%', "sType": "numeric"},{ sWidth: '10%' }],
"sDom": 'rt',
"sScrollY":"200px",
"bPaginate":false,
"bFilter":false,
"bInfo": false});  

所有这一切都是为了锁定列,而向上/向下图标在该列的标题中不起作用。

请帮忙

DKean

4 个答案:

答案 0 :(得分:4)

你的问题是数字没有被识别出来,即使它们是,你的数字中的逗号可能会关闭排序功能(因为它可能无法正确删除它们)。

您可以选择实施自己的排序功能,以便正确处理您的号码。这是一个满足您需求的示例:

http://live.datatables.net/oborug/2/edit

PS - 以下是相关文档:http://datatables.net/development/sorting

答案 1 :(得分:2)

技术上,第二列包含字符串(1,000) - 带逗号的数字,第3列 - 包含百分比的数字)。您要做的最好的事情是将数据作为整数传递给数据表(不带逗号和%),并使用 mRender 选项编写自定义格式化程序以添加逗号和百分比(在 http://www.datatables.net/usage/columns )。

如果您为数据添加自定义格式,请不要忘记将选项设置为使用基础数据作为排序源而不是显示的数据。

答案 2 :(得分:0)

你必须定义一个排序功能(尝试使用按选择排序或按插入排序)尝试将数据变量存储在数组中并进行计算,否则你可以直接对数据进行排序

答案 3 :(得分:0)

您好我使用parseFloat并使用此示例http://datatables.net/release-datatables/examples/basic_init/multi_col_sort.html

替换方法
jQuery.fn.dataTableExt.oSort["string-nbr-asc"]  = function(x,y) {return ((parseFloat(x.replace(",","")) < parseFloat(y.replace(",",""))) ? -1 : ((parseFloat(x.replace(",","")) > parseFloat(y.replace(",",""))) ?  1 : 0));};

jQuery.fn.dataTableExt.oSort["string-nbr-desc"] = function(x,y) {return ((parseFloat(x.replace(",","")) < parseFloat(y.replace(",",""))) ?  1 : ((parseFloat(x.replace(",","")) > parseFloat(y.replace(",",""))) ? -1 : 0));};

如果您有10列,并希望sort 7,8,9使用<{1}}这样的数字

7,081 1,925.49