Problema al ordenar fechas con jquery tablesorter

StackOverflow https://stackoverflow.com/questions/1091921

  •  11-09-2019
  •  | 
  •  

Pregunta

Estoy usando el complemento tablesorter para ordenar mis tablas en una aplicación MVC .NET.La mayoría de mis columnas son cadenas y no tengo problemas con ellas.Tampoco con los numéricos.La cuestión es que mis columnas de fecha y hora también se ordenan como si fueran cadenas.Se clasifican así:04/01/2009, 02/02/2009, 08/03/2009, etc.Obtengo los datos del Modelo en esa Vista.

Mi llamada es la predeterminada: 

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

Intenté especificar el formato de fecha sin suerte:

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

Lo extraño sucede cuando escribo manualmente una tabla estática con fechas aleatorias.¡Se soluciona!Pero mis datos provienen de una llamada a la base de datos y se colocan en el modelo, luego los reviso y escribo tr con los datos.

Gracias de antemano.

EDITAR:¿Podría ser algo relacionado con la forma en que creo los tr?

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

Solución

Trate de añadir un analizador Tablesorter a su columna de fecha. Tablesorter viene con un analizador de shortDate, usLongDate y ISODate. 

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

donde numColumna es la columna con las fechas. El único ejemplo que pude encontrar en el sitio tablesorter es rel="noreferrer"> . Esto también funciona si tablesorter está clasificando los números mal también. Hay otros programas de análisis, así como para ciento, dirección IP y más. Echar un vistazo hacia el final del código fuente y que van a ser listadas allí.

Editar Al analizar el código fuente, la opción dateFormat parece estar buscando sólo "nos", "Reino Unido", "dd / mm / aa" o "dd-mm-aa". ¿Qué pasa cuando se intenta "uk"?

Otros consejos

Tuve el mismo problema y agregué un analizador personalizado llamado 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"
});

Luego solo necesitas aplicar ese formato a las columnas que desees, como lo expuso Gabe G (Por ejemplo, para asignar este clasificador a la primera columna debes hacer lo siguiente:

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

También puede agregar una etiqueta span oculta antes de la fecha en formato numérico (AAAAMMDD). Este texto vendrá primero y ser utilizada para la clasificación pero se oculta a la vista y sólo muestran el formato que desee. 

    <td><span style="display:none">20130923</span>23 September 2013</td>

Más fácil utilización manera: 

dateFormat:'mm/dd/yyyy hh:mm:ss'

Para ser sincero, la solución más simple para mí fue, como dijo compsmart, añadiendo un poco de texto oculto en la parte delantera de la fecha real.

  • dateFormat: 'uk' no estaba trabajando para mí, tal vez porque mi nuevo formato de fecha es diferente
  • http://tablesorter.openwerk.de/ implica la modificación de la CSS, en primer lugar, no entiendo por qué y en segundo lugar el esfuerzo es más grande que la simple adición de texto oculto en la parte delantera de la fecha.

Me gusta la solución beso de compsmart!

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

Ajuste el formato de fecha. Estas son las opciones disponibles. (V2.0.23 Modificado).

  • "mmddaaaa" (por defecto)
  • "ddmmaaaa"
  • "aaaammdd"

En versiones anteriores, esta opción se establece como "nosotros", "Reino Unido" o "dd / mm / aa". Esta opción se ha modificado para mejorar los formatos de fecha ajuste necesario. Sólo funcionará con cuatro años de dígitos!

El clasificador debe estar ajustado a "shortDate" y el formato de fecha se puede ajustar en la opción "dateFormat" o conjunto de unas columnas específicas dentro de la opción "cabeceras". Ver la página de prueba para ver su funcionamiento. 

$(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
    }

  });
});

columnas individuales pueden ser modificados por la adición de la siguiente (todos hacen la misma cosa), situado en orden de prioridad (v2.3.1 Modificado):

  • datos-dateFormat datos jQuery = "mmddyyyy".
  • clase de metadatos = "{dateFormat: 'mmddaaaa'}". Esto requiere el plug-in de metadatos.
  • cabeceras opción encabezados: {0: {dateFormat: 'mmddaaaa'}}.
  • cabecera nombre de la clase class = "dateFormat-mmddaaaa". En general dateFormat opción.

En mi caso he utilizado 

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

para la versión.

Esta fue la respuesta para mí: 

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

más detalles, aquí: https://datatables.net/manual/data/

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top