Проблема с сортировкой дат с помощью jquery tablesorter

Я использую плагин tablesorter для сортировки таблиц в приложении MVC .NET. Большинство моих столбцов являются строками, и у меня нет проблем с ними. Ни с числовыми. Дело в том, что мои столбцы даты и времени также сортируются, как если бы они были строками. Они сортируются следующим образом: 04.01.2009, 02.02.2009, 08.03.2009 и т. д. Я получаю данные из модели в этом представлении.

Мой вызов по умолчанию:

$("#table").tablesorter();

Я попытался указать формат даты без везения:

$("#table").tablesorter({
            dateFormat: 'dd/mm/yyyy'});

Странная вещь происходит, когда я вручную набираю статическую таблицу со случайными датами. Это приводится в порядок! Но мои данные поступают из вызова БД и помещаются в модель, затем я обрабатываю ее и записываю tr с данными.

Заранее спасибо.

РЕДАКТИРОВАТЬ: Может ли это быть связано с тем, как я создаю тр?

<% foreach (var item in Model) { %>
<tr>
<td>
<%= Html.Encode(item.date) %>
</td>
<td>...</td>
<td>...</td>
<td>...</td>
</tr>
<% } %>

person Gabe G    schedule 07.07.2009    source источник
comment
Можно ли отформатировать дату в формате гггг-мм-дд?   -  person ScottE    schedule 07.07.2009
comment
нет, это должно быть в моей стране (Испания). :(   -  person Gabe G    schedule 07.07.2009


Ответы (8)


Попробуйте добавить синтаксический анализатор Tablesorter в столбец даты. Tablesorter поставляется с парсером для shortDate, usLongDate и isoDate.

$("#table").tablesorter({
    headers: { colNum: { sorter: 'shortDate'} }
});

где colNum — столбец с датами. Единственный пример, который мне удалось найти на сайте tablesorter, находится здесь. Это также работает, если tablesorter неправильно сортирует числа. Есть и другие парсеры для процентов, ip адресов и прочего. Взгляните ближе к концу исходного кода, и они будут перечислены там.

Изменить. При просмотре исходного кода параметр dateFormat ищет только "нас", "Великобритания", "дд/мм/гг" или "дд-мм-гг". Что произойдет, если вы попробуете "uk"?

person Ben Koehler    schedule 07.07.2009
comment
Я также пробовал парсер shorDate, но забыл упомянуть. Тоже не повезло :( Я попробую с другими парсерами дат и дам вам знать. Спасибо - person Gabe G; 07.07.2009
comment
Это сработало! Я поставил вызов следующим образом: $(#table).tablesorter({dateFormat: 'uk'}); Мне все время интересно, почему вызов по умолчанию работает так, как предполагалось, при написании таблицы в простом HTML, а не при ее генерации MVC (и необходимости найти этот обходной путь). Спасибо! - person Gabe G; 07.07.2009
comment
И снова StackOverflow оказывается единственным местом с правильным ответом! dateFormat: 'uk' у меня тоже работает, а dateFormat: dd/mm/yyyy - нет. - person Steve Magness; 16.04.2013
comment
дд/мм/гггг не существует ;) - person Cas Bloem; 16.06.2014
comment
@CasBloem, который хромает, потому что их собственная документация утверждает, что поддерживает его: mottie.github.io/tablesorter/docs/ - person Nick Coad; 25.09.2014
comment
Использование dateFormat: «ddmmyyyy» сработало для меня. Он не понимает дд/мм/гггг. - person RC82; 07.03.2016

У меня возникла та же проблема, и я добавил собственный парсер с именем datetime:

$.tablesorter.addParser({
    id: "datetime",
    is: function(s) {
        return false; 
    },
    format: function(s,table) {
        s = s.replace(/\-/g,"/");
        s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
        return $.tablesorter.formatFloat(new Date(s).getTime());
    },
    type: "numeric"
});

Затем вам просто нужно применить этот формат к нужным столбцам, как показал Гейб Г (например, чтобы назначить этот сортировщик первому столбцу, вы должны сделать следующее:

$("#mytable").tablesorter( 
    {   dateFormat: 'dd/mm/yyyy', 
        headers: 
            {
                0:{sorter:'datetime'}
            } 
    } ); 
person fernandojsg    schedule 16.11.2010

Вы также можете добавить скрытый тег span перед датой в числовом формате (ггггммдд). Этот текст будет первым и будет использоваться для сортировки, но он будет скрыт от глаз и будет отображаться только в нужном вам формате.

    <td><span style="display:none">20130923</span>23 September 2013</td>    
person compsmart    schedule 27.02.2013
comment
Было бы логичнее использовать атрибут data-* в ячейке таблицы, а не использовать span в качестве дочернего элемента. - person James Donnelly; 27.02.2013

Существует обновление для плагина jquerytablesorter.

В соответствии с локалью вашего приложения вы можете отсортировать даты по этому обновлению.

Вы можете просмотреть обновление сортировщика таблиц, перейдя по ссылке ниже.

http://tablesorter.openwerk.de/

person ersegun    schedule 16.06.2011

Более простой способ использования:

dateFormat:'mm/dd/yyyy hh:mm:ss'
person Mitesh Vora    schedule 12.07.2013

Честно говоря, самым простым решением для меня было, как сказал compsmart, добавить некоторый скрытый текст перед фактической датой.

  • dateFormat: 'uk' не работал у меня, возможно, потому что мой формат даты снова отличается
  • http://tablesorter.openwerk.de/ предполагает изменение CSS, во-первых, я не понимаю, почему, а во-вторых усилия больше, чем простое добавление скрытого текста перед датой.

Мне нравится решение KISS от compsmart!

person Guido Lo Spacy    schedule 25.09.2013

http://mottie.github.io/tablesorter/docs/

Установите формат даты. Вот доступные варианты. (модифицированная версия 2.0.23).

  • "ммддгггг" (по умолчанию)
  • "ддммгггг"
  • "ггггммдд"

В предыдущих версиях этот параметр был установлен как «us», «uk» или «dd/mm/yy». Эта опция была изменена, чтобы лучше соответствовать необходимым форматам даты. Это будет работать только с четырьмя цифрами года!

Сортировщик должен быть установлен на «shortDate», а формат даты может быть установлен в параметре «dateFormat» или установлен для определенных столбцов в параметре «заголовки». Посмотрите демо-страницу, чтобы увидеть, как это работает.

$(function(){
  $("table").tablesorter({

    dateFormat : "mmddyyyy", // default date format

    // or to change the format for specific columns,
    // add the dateFormat to the headers option:
    headers: {
      0: { sorter: "shortDate" }, // "shortDate" with the default dateFormat above
      1: { sorter: "shortDate", dateFormat: "ddmmyyyy" }, // day first format
      2: { sorter: "shortDate", dateFormat: "yyyymmdd" }  // year first format
    }

  });
}); 

Отдельные столбцы можно изменить, добавив следующее (все они делают одно и то же), установив их в порядке приоритета (Изменено v2.3.1):

  • Формат данных jQuery data-dateFormat="mmddyyyy".
  • класс метаданных = "{ dateFormat: 'mmddyyyy'}". Для этого требуется плагин метаданных.
  • Заголовки параметров заголовков: { 0 : { dateFormat : 'mmddyyyy' } }.
  • имя класса заголовка class="dateFormat-mmddyyyy". Общий формат даты.

В моем случае я использовал

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

для версии.

person Licysca    schedule 02.03.2015

Это был ответ для меня:

<td data-order=<fmt:formatDate pattern = "yyyy-MM-dd" value = "${myObject.myDate}" />>${myObject.myDate}</td>

подробнее здесь: https://datatables.net/manual/data/

person Forrest    schedule 27.08.2019