Skip to main content
se eliminaron 47 caracteres en el cuerpo
Origen Enlace
Yussef
  • 23.4k
  • 4
  • 12
  • 29
// El 10 representa la cantidad de ceros |
//                                       |
//                                       V
console.log(Number("1".toString().padEnd(10,"0")));
console.log(Number("123".toString().padEnd(10,"0")));
console.log(Number("32323232".toString().padEnd(10,"0")));
$(document).ready(function () {
$('.example1').DataTable({
   columns: [{
      orderable: true,
       data: function ( row, type, val, meta ) {
         if (type === 'set') {
            row.cuentaEntera = Number(val.toString().padEnd(10,"0"));
            row.cuenta = val;
            return;
         }
         else if(type === 'display') return row.cuenta;
         else if(type === 'filter') return row.cuenta;
         else if(type === 'sort') return row.cuentaEntera;
         return row.cuenta;
      }
   }]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.css" />
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.js"></script>

    <table class="example1 display nowrap" width="100%">
        <thead>
            <tr>
                <th>Cuenta</th>
            </tr>
        </thead>
        <tbody>
            <tr><td>110101</td></tr>
            <tr><td>1</td></tr>
            <tr><td>1101</td></tr>
            <tr><td>11010201</td></tr>
            <tr><td>110102</td></tr>
            <tr><td>1101030101</td></tr>
            <tr><td>110103</td></tr>
             <tr><td>11</td></tr>
            <tr><td>11010301</td></tr>
            
        </tbody>
    </table>
// El 10 representa la cantidad de ceros |
//                                       |
//                                       V
console.log(Number("1".toString().padEnd(10,"0")));
console.log(Number("123".toString().padEnd(10,"0")));
console.log(Number("32323232".toString().padEnd(10,"0")));
$(document).ready(function () {
$('.example1').DataTable({
   columns: [{
      orderable: true,
       data: function ( row, type, val, meta ) {
         if (type === 'set') {
            row.cuentaEntera = Number(val.toString().padEnd(10,"0"));
            row.cuenta = val;
            return;
         }
         else if(type === 'display') return row.cuenta;
         else if(type === 'filter') return row.cuenta;
         else if(type === 'sort') return row.cuentaEntera;
         return row.cuenta;
      }
   }]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.css" />
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.js"></script>

    <table class="example1 display nowrap" width="100%">
        <thead>
            <tr>
                <th>Cuenta</th>
            </tr>
        </thead>
        <tbody>
            <tr><td>110101</td></tr>
            <tr><td>1</td></tr>
            <tr><td>1101</td></tr>
            <tr><td>11010201</td></tr>
            <tr><td>110102</td></tr>
            <tr><td>1101030101</td></tr>
            <tr><td>110103</td></tr>
             <tr><td>11</td></tr>
            <tr><td>11010301</td></tr>
            
        </tbody>
    </table>
// El 10 representa la cantidad de ceros 
//                                |
//                                V
console.log("1".toString().padEnd(10,"0"));
console.log("123".toString().padEnd(10,"0"));
console.log("32323232".toString().padEnd(10,"0"));
$(document).ready(function () {
$('.example1').DataTable({
   columns: [{
      orderable: true,
       data: function ( row, type, val, meta ) {
         if (type === 'set') {
            row.cuentaEntera = val.toString().padEnd(10,"0");
            row.cuenta = val;
            return;
         }
         else if(type === 'display') return row.cuenta;
         else if(type === 'filter') return row.cuenta;
         else if(type === 'sort') return row.cuentaEntera;
         return row.cuenta;
      }
   }]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.css" />
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.js"></script>

    <table class="example1 display nowrap" width="100%">
        <thead>
            <tr>
                <th>Cuenta</th>
            </tr>
        </thead>
        <tbody>
            <tr><td>110101</td></tr>
            <tr><td>1</td></tr>
            <tr><td>1101</td></tr>
            <tr><td>11010201</td></tr>
            <tr><td>110102</td></tr>
            <tr><td>1101030101</td></tr>
            <tr><td>110103</td></tr>
             <tr><td>11</td></tr>
            <tr><td>11010301</td></tr>
            
        </tbody>
    </table>
Origen Enlace
Yussef
  • 23.4k
  • 4
  • 12
  • 29

Las cuentas contables siguen una estructura de árbol, se ordenan fácilmente de menor a mayor ya que el nodo padre siempre es menor que sus hijos.

Lo que pasa es que a ti te faltan los ceros a la derecha de los nodos padres, supongamos que las cuentas contables están representadas con un número fijo de 10 dígitos, tu tienes un 1 cuando deberías tener un 1000000000 o un 1334 cuando deberías tener 1334000000`

Para convertir un 1 en 1000000000, puedes usar la siguiente función:

// El 10 representa la cantidad de ceros |
//                                       |
//                                       V
console.log(Number("1".toString().padEnd(10,"0")));
console.log(Number("123".toString().padEnd(10,"0")));
console.log(Number("32323232".toString().padEnd(10,"0")));

Luego en la columna "Cuenta", el data lo pasamos con función para poder intervenir en ella y le creamos una propiedad oculta row.cuentaEntera que tendrá el valor de la cuenta con todos los cero a la derecha y usaremos ese valor para ordenar y no el valor que se muestra en pantalla que será row.cuenta

$(document).ready(function () {
$('.example1').DataTable({
   columns: [{
      orderable: true,
       data: function ( row, type, val, meta ) {
         if (type === 'set') {
            row.cuentaEntera = Number(val.toString().padEnd(10,"0"));
            row.cuenta = val;
            return;
         }
         else if(type === 'display') return row.cuenta;
         else if(type === 'filter') return row.cuenta;
         else if(type === 'sort') return row.cuentaEntera;
         return row.cuenta;
      }
   }]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.css" />
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-html5-1.5.2/b-print-1.5.2/datatables.min.js"></script>

    <table class="example1 display nowrap" width="100%">
        <thead>
            <tr>
                <th>Cuenta</th>
            </tr>
        </thead>
        <tbody>
            <tr><td>110101</td></tr>
            <tr><td>1</td></tr>
            <tr><td>1101</td></tr>
            <tr><td>11010201</td></tr>
            <tr><td>110102</td></tr>
            <tr><td>1101030101</td></tr>
            <tr><td>110103</td></tr>
             <tr><td>11</td></tr>
            <tr><td>11010301</td></tr>
            
        </tbody>
    </table>