Проблема сортировки даты с помощью JQuery Tablesorter
https://stackoverflow.com/questions/1707840
-
19-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianВопрос
Я пытаюсь отсортировать таблицу, в которой есть столбец типа 2009-12-17 23:59:59.0.Я использую ниже, чтобы применить сортировку
$(document).ready(function()
{
$("#dataTable").tablesorter();
}
);
Но это не работает для дат в формате гггг-мм-дд.Может ли кто-нибудь подсказать, как применить этот формат для сортировки?
Решение
Правильным решением было бы добавить свой собственный парсер для этого пользовательского формата.
Проверьте это, чтобы понять, как это работает.
Сортировщик таблиц jQuery:Добавьте свой парсер
Затем загляните в исходный код tablesorter (найдите uslongdate, shortdate, а затем посмотрите, как анализаторы форматов дат выполняются внутри tablesorter.Теперь создайте аналогичный парсер для вашего конкретного формата даты.
Это должно подойти вам по вкусу
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"
});
Теперь просто примените его к столбцу, в котором у вас есть этот формат (например,при условии, что столбец, в котором находятся ваши пользовательские даты, находится в столбце №.7.(6 означает столбец 7, поскольку массив столбцов начинается с нуля)
$(function() {
$("table").tablesorter({
headers: {
6: { sorter:'customDate' }
}
});
});
Другие советы
Сортировать британский/европейский формат даты дд/мм/гггг по:
$("#tableName").tablesorter({dateFormat: "uk"});
Если вы используете формат даты/времени, например мм/дд/гггг чч:мм, используйте ниже
$.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 вы можете просто сделать это. Просто укажите формат даты по умолчанию и в конкретном столбце установите формат даты столбца, это будет работать ТОЛЬКО с сортировщиком «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 }
}
});
Нет необходимости создавать новый парсер просто используйте существующий с небольшими изменениями.
1. Откройте плагин Jquery js, где вы увидите приведенный ниже скрипт. Теперь просто измените формат даты (желаемый) на последний, если в вашем случае это «гг-мм-дд».
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' }
}
});
});
Формат даты :"ммддигггг", // устанавливаем формат даты по умолчанию
Просто добавьте еще один вариант, который отлично подходит для сортировки формата даты (дд/ММ/гггг чч:мм:сс).С помощью js таблицы данных плагин.
Добавьте приведенный ниже код в свой 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;
}
} );
