Analizador personalizado para jQuery Tablesorter

Question

Estoy usando el jQuery Tablesorter y tienen un problema con el orden en que se aplican programas de análisis en las columnas de la tabla . Estoy agregando un analizador personalizado para manejar la moneda de la forma $ -3.33.

$.tablesorter.addParser({
    id: "fancyCurrency",
    is: function(s) {
      return /^\$[\-]?[0-9,\.]*$/.test(s);
    },
    format: function(s) {
      s = s.replace(/[$,]/g,'');
      return $.tablesorter.formatFloat( s );
    },
    type: "numeric"
});

El problema parece ser que el analizador de divisas incorporada tiene prioridad sobre mi analizador personalizado. Podría poner el analizador en el código tablesorter sí (antes de que el programa de análisis de divisas) y funciona correctamente, pero esto no es muy fácil de mantener. No puedo especificar el clasificador de forma manual utilizando algo como:

headers: {
    3: { sorter: "fancyNumber" },
    11: { sorter: "fancyCurrency" }
}

desde las columnas de tabla se generan dinámicamente a partir de entradas de usuario. Creo que una opción sería la de especificar el clasificador para usar como una clase CSS y utilizar un poco de jQuery para especificar explícitamente un clasificador como esta pregunta sugiere, pero prefiero seguir con detección dinámica si es posible.

Answer 1

La primera opción es dar las columnas que tienen la moneda valora la clase adicional "{ 'clasificador': 'moneda'}". También asegúrese de que está incluyendo los metadatos plugin, que tablesorter soportes. Esto hará que en las opciones por elemento y decirle explícitamente tablesorter cómo ordenar.

<link rel="stylesheet" href="/css/jquery/tablesorter/green/style.css" />
<script src="/js/jquery-1.3.2.js"></script>
<script src="/js/jquery.ui.core.js"></script>
<script src="/js/jquery.metadata.js"></script>
<script src="/js/jquery.tablesorter.js"></script>

<script>
    $(document).ready(function()
    {
    $("#table").tablesorter();
    }
    );
    </script>
</head>
<table id="table" class="tablesorter">
<thead>
  <tr>
    <th class="{'sorter':'currency'}">Currency</th>
    <th>Integer</th>
    <th>String</th>
  </tr>
</thead>
<tbody>
<tr>
  <td class="{'sorter':'currency'}">$3</td>
  <td>3</td>
  <td>three</td>
</tr>
<tr>
  <td class="{'sorter':'currency'}">-$3</td>
  <td>-3</td>
  <td>negative three</td>
</tr>
<tr>
  <td class="{'sorter':'currency'}">$1</td>
  <td>1</td>
  <td>one</td>
</tr>
</tbody>
</table>

Además, hay un error en la función de formato de moneda: no maneja números negativos

.

He presentado una , y estoy trabajando en el aterrizaje de un parche.

La segunda opción es aplicar esta revisión a su copia de tablesorter. Una vez que haya aplicado la revisión, no será necesario especificar el clasificador de moneda en el XX o de TD (especificando en el TD es el exceso de matar de todos modos).

  

Editar línea 724 de jquery.tablesorter.js:

     

retorno $ .tablesorter.formatFloat (s.replace (nuevo RegExp (/ [^ 0-9.] / G), ""));

     

cambiar a:

     

devolver $ .tablesorter.formatFloat (s.replace (nuevo RegExp (/ [^ - 0-9.] / G), ""));

     

caso:

     

  

• valores: $ -3, $ 1, $ 3

  

• actual orden ASC: $ 1, $ 3, $ - 3

  

• esperado fin asc $ -3, $ 1, $ 3

  

     

caso:

     

  

• Los valores: - $ 3, $ 1, $ 3

  

• actual orden ASC: $ 1, $ 3, - $ 3

  

• esperado fin asc $ -3, $ 1, $ 3

  

Answer 2

Yo tenía un problema similar y descubrí la href="http://tablesorter.com/docs/example-option-text-extraction.html" rel="nofollow"> textExtraction opción que es recomendada cuando sus células contienen marcado. Sin embargo, funciona perfectamente bien como un formateador de pre-formato!

$('table').tablesorter({
  textExtraction: function(s) {
    var text = $(s).text();
    if (text.charAt(0) === '$') {
      return text.replace(/[^0-9-.]/g, '');
    } else {
      return text;
    }
  }
});

Answer 3

he usado algo como esto y funcionó para mí.

Utilice esta clase en la cabecera y en la columna .

Una vez que su hecho, hacer cambios en el código javascript para obtener toda la moneda en forma de dígitos.

Su hecho, disfrutar de la clasificación !!!

Este es el código:

CABECERA:

  <th style='width: 98px;' class="{'sorter':'digit'}">
            Amount
   </th>

columna (td):

 <td align="left" style='width: 98px;' class="{'sorter':'digit'}">
            <%= Convert.ToDouble( a.AMOUNT ?? 0.0).ToString("C3") %>
 </td>

El javascript:

<script language="javascript" type="text/javascript">
  jQuery("#rewardtable").tablesorter({
    textExtraction: function (data) {
        var text = $(data).text();
        if (text.toString().indexOf("-$") != -1) {
            return ("-" + text.replace(new RegExp(/[^0-9.]/g), ""));
        }
        else if (text.toString().indexOf("$") != -1) {
            return (text.replace(new RegExp(/[^-0-9.]/g), ""));
        }
        else {
            return text;
        }
    }
  });