3

Estoy haciendo un catálogo de cuentas en php y mysql. Para facilitar uso DataTables para orden de datos y lo llevo de la siguiente manera:

Catalogo de cuentas inicial

El problema es que no quiero que se ordenen por el id sino más bien por el orden jerárquico de la columna cuenta. A mi código de Datatable lo tengo estructurado de la siguiente manera; ya ejecuté las maneras posibles para ordenas datos y lo que consigo es que me los ordene en orden número, es decir, 1,2,3,4,5,6 y luego 11,21,31,41,51,61, para luego llegar a las cifras de 4 dígitos, pero no consigo que respeten su orden jerárquico.

Acá les dejo cómo llevo configurado el DataTable:

$(document).ready(function() {
    tabla = $('#tabla').DataTable({
      "ordering": true, // Con esto le estás diciendo que se pueda ordenar, ponlo a 'true'
      "order": [], // Aquí le dices que el criterio de ordenación primero esté vació , o lo que es lo mismo, ninguno
      'ajax': {
        'url': 'buscadorDatatable.php?tabla=catalogocuentas',
        'dataSrc': ''
      },
      select: 'multi',
      columns: [{
        data: null,
        orderable: true,
        defaultContent: '<input type="checkbox" class="check" />',
        className: 'check',
        targets: 0
      }, {
        data: 'id',
        orderable: false // Hacer la columna "id" no ordenable
      }, {
        data: 'cuenta',
        orderable: true // Hacer la columna "id" no ordenable
      }, {
        data: 'nombrecuenta'
      }, {
        data: 'naturaleza'
      }, {
        data: 'tipo'
      }, {
        data: 'nivel'
      }, {
        data: 'estatus'
      }, {
        data: 'saldoinicial'
      }, {
        data: 'saldofinal'
      }, {
        "defaultContent": '<div class="opciones-externas"><a href="#" class="btn btn-outline-primary editar"><i class="icon-pencil"></i></a><a href="#" class="btn btn-outline-primary eliminar"><i class="icon-cancel text-danger"></i></a></div>'
      }],
      columnDefs: [{
          type: 'cuenta',
          targets: [3]
        } // Aplica el tipo de ordenamiento personalizado a la columna "cuenta"
      ],
      responsive: true,
      dom: 'Bfrtip',
      searching: false,
      aasorting: [],
      buttons: ['copy', 'print', 'excel', 'pdf'],
      processing: true,
      language: {
        "sProcessing": "Procesando...",
        "sLengthMenu": "Mostrar _MENU_ registros",
        "sZeroRecords": "No se encontraron resultados",
        "sEmptyTable": "Ningún dato disponible en esta tabla",
        "sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_",
        "sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0",
        "sInfoFiltered": "(filtrado de un total de _MAX_ registros)",
        "sInfoPostFix": "",
        "sSearch": "Buscar:",
        "sUrl": "",
        "sInfoThousands": ",",
        "sLoadingRecords": "Cargando...",
        "oPaginate": {
          "sFirst": "Primero",
          "sLast": "Último",
          "sNext": "Siguiente",
          "sPrevious": "Anterior"
        },
        "oAria": {
          "sSortAscending": ": Activar para ordenar la columna de manera ascendente",
          "sSortDescending": ": Activar para ordenar la columna de manera descendente"
        }
      }
    });
8
  • No entiendo a que te refieres con "que respeten el orden jerarquico"
    – Yussef
    Commented el 29 dic. 2023 a las 2:07
  • A ese orden que se ve en la imagen 1, 11 1101 110101 2 21, 2101 210101 Y asi sucesivamente hasta llegar a nivel 6, ahi solo he mostrado dos niveles. Commented el 29 dic. 2023 a las 3:02
  • Has probado a desactivar la ordenación de la columna ID directamente en la tabla? En el <thead>, en la columna que lleva el título 'ID' colocas <th data-orderable="false">ID</th> Commented el 29 dic. 2023 a las 3:12
  • sigo sin entender, ahora hablas de niveles :S. Cual sería la salida esperada?
    – Yussef
    Commented el 29 dic. 2023 a las 3:47
  • La salida esperada deberia de ser 1. 1101 110102 11010203 siguiendo el patron inicial de 1 cambiar a 2. 2. 2101 210102 21010203 A 3 3. 3101 310102 31010203 A 4 4. 4101 410102 41010203 A 5 5. 5101 510102 51010203 A 6 6. 6101 610102 61010203 Y asi sucesivamente cambiando hasta llegar a 6 ya que son 6 cuentas contables. El problema que yo tengo ahorita es que si yo agrego un registro que es numero de cuenta: 11010204 Me lo esta dejando de ultimo en orden de id cuando que en realidad deberia de seguir el patron inicial del 1 ya que inicia con 1. Commented el 29 dic. 2023 a las 4:06

1 respuesta 1

0

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("1".toString().padEnd(10,"0"));
console.log("123".toString().padEnd(10,"0"));
console.log("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 = 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>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.