datesorting问题与JQuery的Tablesorter

我正在尝试sorting一个列,如2009-12-17 23:59:59.0 。 我正在使用下面的应用sorting

 $(document).ready(function() { $("#dataTable").tablesorter(); } ); 

但它不适用于格式为yyyy-mm-dd的date。 任何人可以build议如何应用这种格式进行sorting?

正确的做法是为自定义格式添加自己的parsing器。

检查这个来了解它是如何工作的。

jQuery Tablesorter:添加你自己的parsing器

然后看看tablesorter的源代码(searchuslongdate,shortdate,然后观察date格式的parsing器是如何由tablesorter在内部完成的。现在为自己的date格式构造一个类似的parsing器。

jquery.tablesorter.js

这应该符合你的喜好

 ts.addParser({ id: "customDate", is: function(s) { //return false; //use the above line if you don't want table sorter to auto detected this parser //else use the below line. //attention: doesn't check for invalid stuff //2009-77-77 77:77:77.0 would also be matched //if that doesn't suit you alter the regex to be more restrictive return /\d{1,4}-\d{1,2}-\d{1,2} \d{1,2}:\d{1,2}:\d{1,2}\.\d+/.test(s); }, format: function(s) { s = s.replace(/\-/g," "); s = s.replace(/:/g," "); s = s.replace(/\./g," "); s = s.split(" "); return $.tablesorter.formatFloat(new Date(s[0], s[1]-1, s[2], s[3], s[4], s[5]).getTime()+parseInt(s[6])); }, type: "numeric" }); 

现在把它应用到你有这种格式的列(例如,假设你自定义date所在的列在第7列中。(6表示第7列,因为列的数组是零)

 $(function() { $("table").tablesorter({ headers: { 6: { sorter:'customDate' } } }); }); 

英国/欧洲的date格式日/月/年/月/年:

 $("#tableName").tablesorter({dateFormat: "uk"}); 

如果您使用date/时间格式,如mm / dd / yyyy hh:mm,则在下面使用

 $.tablesorter.addParser({ id: "customDate", is: function(s) { //return false; //use the above line if you don't want table sorter to auto detected this parser //21/04/2010 03:54 is the used date/time format return /\d{1,2}\/\d{1,2}\/\d{1,4} \d{1,2}:\d{1,2}/.test(s); }, format: function(s) { s = s.replace(/\-/g," "); s = s.replace(/:/g," "); s = s.replace(/\./g," "); s = s.replace(/\//g," "); s = s.split(" "); return $.tablesorter.formatFloat(new Date(s[2], s[1]-1, s[0], s[3], s[4]).getTime()); }, type: "numeric"} ); 

使用最新的版本2.18.4,你可以简单地这样做。只要给出默认的date格式,并在特定的列设置列date格式,这将只与“shortDate”分拣机工作。

 $('YourTable').tablesorter( { dateFormat:'mmddYYYY', headers: { 0: { sorter: false }, 1: { sorter: true}, 2: { sorter: true }, 3: { sorter: true }, 4: { sorter: "shortDate", dateFormat: "ddmmyyyy" }, 5: { sorter: true }, 6: { sorter: false }, 7: { sorter: false }, 8: { sorter: false }, 9: { sorter: false }, 10: { sorter: false }, 11: { sorter: false } } }); 

不需要创build新的parsing器,需要使用现有的parsing器即可。

1.打开jquery插件js,在那里你会看到下面的脚本。现在只要改变date格式(期望)的最后一个,如果你的情况是“yy-mm-dd”。

  ts.addParser({ id: "shortDate", is: function (s) { return /\d{1,2}[\/\-]\d{1,2}[\/\-]\d{2,4}/.test(s); }, format: function (s, table) { var c = table.config; s = s.replace(/\-/g, "/"); if (c.dateFormat == "us") { // reformat the string in ISO format s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$1/$2"); } else if (c.dateFormat == "uk") { // reformat the string in ISO format s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1"); } else if (c.dateFormat == "yy-mm-dd" || c.dateFormat == "dd-mm-yy") { s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{2})/, "$1/$2/$3"); } return $.tablesorter.formatFloat(new Date(s).getTime()); }, type: "numeric" }); 

2.现在按照抖动提到的最后一步,但稍作修改。

 $(function() { $("table").tablesorter({ headers: { 6: { sorter:'shortDate' } } }); }); 

dateFormat:“mmddyyyy”,//设置默认的date格式

例如,期权date格式

只需添加另一个select完全适合我sortingdate格式(日/月/年 )。 通过使用js dataTables插件。

将以下代码添加到您的代码中:

 $(document).ready(function () { oTable = $('#AjaxGrid').dataTable({ "aLengthMenu": [[5, 10, 25, 50, 100, 500,1000,-1], [5, 10, 25, 50, 100,500,1000,"All"]], iDisplayLength: 1000, aaSorting: [[2, 'asc']], bSortable: true, aoColumnDefs: [ { "aTargets": [ 1 ], "bSortable": true }, { "aTargets": [ 2 ], "bSortable": true }, { "aTargets": [ 3 ], "bSortable": true }, { "aTargets": [ 4 ], "bSortable": true }, {"aTargets": [ 5 ], "bSortable": true, "sType": "date-euro"}, {"aTargets": [ 6 ], "bSortable": true, "sType": "date-euro"}, { "aTargets": [ 7 ], "bSortable": false } ], "sDom": '<"H"Cfr>t<"F"ip>', "oLanguage": { "sZeroRecords": "- No Articles To Display -", "sLengthMenu": "Display _MENU_ records per page", "sInfo": " ", //"Displaying _START_ to _END_ of _TOTAL_ records", "sInfoEmpty": " ", //"Showing 0 to 0 of 0 records", "sInfoFiltered": "(filtered from _MAX_ total records)" }, "bJQueryUI": true }); }); //New code jQuery.extend( jQuery.fn.dataTableExt.oSort, { "date-euro-pre": function ( a ) { if ($.trim(a) != '') { var frDatea = $.trim(a).split(' '); var frTimea = frDatea[1].split(':'); var frDatea2 = frDatea[0].split('/'); var x = (frDatea2[2] + frDatea2[1] + frDatea2[0] + frTimea[0] + frTimea[1] + frTimea[2]) * 1; } else { var x = 10000000000000; // = l'an 1000 ... } return x; }, "date-euro-asc": function ( a, b ) { return a - b; }, "date-euro-desc": function ( a, b ) { return b - a; } } );