jQuery Tablesorter 的日期排序问题
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1707840/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Date sorting problem with jQuery Tablesorter
提问by CFUser
I am trying to sort a table which has column like 2009-12-17 23:59:59.0
.
I am using below to apply sort
我正在尝试对具有类似2009-12-17 23:59:59.0
. 我在下面使用来应用排序
$(document).ready(function() {
$("#dataTable").tablesorter();
});
But its not working for the dates of format yyyy-mm-dd. Can any one suggest how can i apply this format for sorting?
但它不适用于 yyyy-mm-dd 格式的日期。任何人都可以建议我如何应用这种格式进行排序?
回答by jitter
The right thing to do would be to add your own parser for this custom format.
正确的做法是为此自定义格式添加您自己的解析器。
Check this to get a grasp on how that works.
检查这个以了解它是如何工作的。
jQuery Tablesorter: Add your own parser
Then take a look into the tablesorter source (search for uslongdate, shortdate and then watch how the parsers for date formats are internally done by tablesorter. Now construct your self a similar parser for your particular date format.
然后查看 tablesorter 源(搜索 uslongdate、shortdate,然后观察日期格式的解析器如何由 tablesorter 在内部完成。现在为您的特定日期格式构建一个类似的解析器。
This should work to your liking
这应该符合您的喜好
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"
});
Now just apply it to the column where you have this format (e.g. assuming the column your custom dates reside in are in column No. 7. (6 means column 7, because the array of the columns is zerobased)
现在只需将它应用于您具有此格式的列(例如,假设您的自定义日期所在的列位于第 7 列中。(6 表示第 7 列,因为列的数组是基于零的)
$(function() {
$("table").tablesorter({
headers: {
6: { sorter:'customDate' }
}
});
});
回答by Peter Dolinaj
Sort UK/European date format dd/mm/yyyy by:
按以下方式对英国/欧洲日期格式 dd/mm/yyyy 进行排序:
$("#tableName").tablesorter({dateFormat: "uk"});
回答by V.B
With the latest version 2.18.4 you can simply do like this.Just give the default date format and in the particular column set the column date format this will work ONLY with 'shortDate' sorter.
使用最新版本 2.18.4,您可以简单地这样做。只需提供默认日期格式,并在特定列中设置列日期格式,这仅适用于“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 }
}
});
回答by Aleem Latif
If you are using date/time format like mm/dd/yyyy hh:mm then use below
如果您使用日期/时间格式,如 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"} );
回答by RollerCosta
No need to create new parserjust use the exisitng one with little modification.
1.Open Jquery plugin js, where you will see the below script.Now just change the date format(desired) for the last else if in your case it is "yy-mm-dd".
无需创建新的解析器,只需稍加修改即可使用现有的解析器。
1.打开 Jquery 插件 js,您将在其中看到以下脚本。如果您的情况是“yy-mm-dd”,则只需更改最后一个 else 的日期格式(所需)。
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})/, "//");
} else if (c.dateFormat == "uk") {
// reformat the string in ISO format
s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "//");
} else if (c.dateFormat == "yy-mm-dd" || c.dateFormat == "dd-mm-yy") {
s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{2})/, "//");
}
return $.tablesorter.formatFloat(new Date(s).getTime());
}, type: "numeric"
});
2.Now follow the last step mentioned by jitter, but with little modification.
2.现在按照 jitter 提到的最后一步,但几乎没有修改。
$(function() {
$("table").tablesorter({
headers: {
6: { sorter:'shortDate' }
}
});
});
回答by b3wii
dateFormat : "mmddyyyy", // set the default date format
dateFormat : "mmddyyyy", // 设置默认日期格式
回答by Bruce Yo
Just add another choice works perfectly for me to sort the date format (dd/MM/yyyy hh:mm:ss). By using the js dataTablesplugin.
只需添加另一个选项对我来说非常适合对日期格式(dd/MM/yyyy hh:mm:ss)进行排序。通过使用js 数据表插件。
Add the code below to your is code:
将以下代码添加到您的 is 代码中:
$(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;
}
} );