jquery-plugins - bootstrap - tablesorter mottie

jQuery tablesorter plugin clasificación secundaria “oculta”

Question

Estoy usando el complemento jQuery tablesorter y tengo una columna que contiene el nombre del mes y el año como este

April, 1975
January, 2001

Me gustaría ordenar esta columna como si fuera una columna de fecha. Como lo entiendo, es posible ordenar la columna con algún otro valor ''oculto'', pero parece que no puedo encontrar la documentación para esa característica. ¿Alguna ayuda por ahí?

Actualizar

Este tenedor http://mottie.github.com/tablesorter/docs/index.html del tablesorter tenía justo lo que necesitaba; La capacidad de almacenar el valor para ordenar en un atributo, funcionó realmente bien.

Answer 1

Discúlpese por responder a una pregunta anterior, pero esta es ahora una CARACTERÍSTICA ESTÁNDAR de tablesorter , aunque por algún motivo no está documentada. Si abre el archivo https://github.com/christianbach/tablesorter/blob/master/jquery.tablesorter.js y mira la línea # 307, verá que es compatible con el atributo "datos-valor-valor".

Uso:

<td data-sort-value="42">Answer to the question</td>

Answer 2

Es un poco pirateado (está bien, es un pirateo total), pero si configura el analizador de la columna en "texto" y arregla previamente su bonita salida con la cadena que realmente desea clasificar dentro de un espacio oculto. ordenará correctamente

Puede configurar el analizador en una columna con la opción de headers , por ejemplo, para configurar el analizador en la primera y la segunda columnas en "texto", establecería lo siguiente:

headers: {0: {sorter: ''text''}, : {sorter: ''text''}

Para hacer este truco con fechas, puede usar el formato de fecha ISO8601 que ordena léxicamente. Los objetos Date de JS pueden generar cadenas de fecha ISO8601 a través de la función toISOString() .

Dado el CSS:

span.hidden{
    display:none;
}

Una celda de muestra en la tabla se vería así:

<td><span class="hidden">2015-04-18T23:48:33</span>19 April 2015</td>

No es el código más bonito del mundo, pero funciona.

Answer 3

Necesitas escribir tu propio analizador . Su analizador podría terminar buscando algo como:

var months = {''January'':1,''February'':2, ...};
$.tablesorter.addParser({
    id: ''myDate'', 
    is: function(s) { return false; }, 
    format: function(s) {
        var x = s.split('', '');
        return x[1]+''-''+months[x[2]];
    },
    type: ''numeric'' 
});

No probado, pero idea general.

Answer 4

Simplemente utilizando la función textExtraction. Establece el valor de clasificación de datos en tus TDs. El valor predeterminado es texto normal si no está presente.

$(".sort-table").tablesorter({
    textExtraction: function(node) {
        var attr = $(node).attr(''data-sort-value'');
        if (typeof attr !== ''undefined'' && attr !== false) {
            return attr;
        }
        return $(node).text(); 
    } 
}); 

Answer 5

Tengo una bifurcación de http://mottie.github.com/tablesorter/docs/index.html que le permite escribir un analizador que puede extraer atributos de datos de la celda de la tabla y asignar una extracción de texto específica para cada columna .

$(function(){

  $.tablesorter.addParser({ 
    // set a unique id 
    id: ''myParser'', 
    is: function(s) { 
      // return false so this parser is not auto detected 
      return false; 
    }, 
    format: function(s, table, cell, cellIndex) { 
      // get data attributes from $(cell).attr(''data-something'');
      // check specific column using cellIndex
      return $(cell).attr(''data-something'');
    }, 
    // set type, either numeric or text 
    type: ''text'' 
  }); 

  $(''table'').tablesorter({ 
    headers : { 
      0 : { sorter: ''myParser'' }
    }
  });

});

Answer 6

estoy usando

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.29.0/js/jquery.tablesorter.min.js"></script>

Trabajando con datos-texto

<td data-text="42">Answer to the question</td>

No trabajando con datos-orden-valor

<td data-sort-value="42">Answer to the question</td>