2013-07-23 66 views
9

我有一個包含數字和NA列的表。自定義排序的jQuery數據表列

<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的列進行排序,以產生如下:

NA,100,200,300,1024,20962096,1024,300, 200,100,不適用

但無法弄清楚如何通過閱讀排序和插件文檔。

我在這裏創建了一小部分代碼:http://jsfiddle.net/stowball/rYtxh/,真的很感謝您的幫助。

+1

如果你用「 - 」代替「NA 「它工作正常這裏是js小提琴http://jsfiddle.net/stowball/rYtxh/ – Umesh

+0

@ umesh25謝謝,這真的很有趣!如果我沒有得到任何其他解決方案,我可能必須這樣做。 –

回答

11

通過查看帶有HTML插件的Numbers,您可以使用現有代碼並修改正則表達式以查找負數而不是剝離所有內容。使用它你可以在「NA」周圍放置HTML標籤,並使用HTML5數據內部標識來存儲最低數量的集合。

,使其成爲:

<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)); 
}}); 

然後在數據表中,將類型設置爲num-HTML

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

你可以看到我的完整解決方案在這裏:http://jsfiddle.net/rYtxh/4/

7

只需在<td>元素中使用data-order屬性即可。插件將基於此進行排序。對於你的情況下,HTML會:

<tr> 
    <td "data-order=-1">NA</td> 
</tr> 
<tr> 
    <td "data-order=1024">1024</td> 
</tr> 
<tr> 
    <td "data-order=100">100</td> 
</tr> 
<tr> 
    <td "data-order=200">200</td> 
</tr> 
<tr> 
    <td "data-order=300">300</td> 
</tr> 
<tr> 
    <td "data-order=2096">2096</td> 
</tr> 

更多HTML5特性都可以用來解決濾波的問題,分類,搜索等

https://datatables.net/examples/advanced_init/html5-data-attributes.html

+0

答案很有幫助,引號的位置是錯誤的。 – Ken