0

Tengo problemas para mostrar filas secundarias en DataTables.

Al principio cuando actualizo la tabla según lo seleccionado en la primera opción de selección “Select Combo” me muestra la columna secundaria. El problema se da cuando selecciono otra opción en el mismo “Select Combo” o en el segundo o tercero no me muestra las filas secundarias.

Les paso parte del codigo del primer “Select Combo”, los otos dos son lo mismo.

enter image description here

// JavaScript Document
$(document).ready(function(){
$("#estado_reside").on("change",function(){
    var estado_reside = $(this).val();
    var table = $('#table_01').DataTable({
        "ajax": "get_estructuras_edo.php",
        "rowId": 'id',
        "columns": [{
            "className": 'dt-control',
            "orderable": false,
            "data": null,
            "defaultContent": ''
        },
        { "data": "nombre_cargo" },
        { "data": "nombre_apellido" },
        { "data": "cedula" },
        { "data": "telefono" }
        ],
        order: [[1, 'asc']],
        destroy: true,
        processing: true,
        responsive: true,
        dom: 'Blfrtip', /*Bfrtip*/
        buttons: ['copyHtml5', 'excelHtml5', 'csvHtml5', 'pdfHtml5' ],
        language: {
            url: 'https://cdn.datatables.net/plug-ins/1.13.7/i18n/es-ES.json'
        },
    });
    $('#table_01').on('click', 'tbody td.dt-control', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );
        
        if ( row.child.isShown() ) {
            row.child.hide();
        }
        else {
            row.child( format(row.data()) ).show();
        }
    } );
    $('#table_01').on('requestChild.dt', function(e, row) {
        row.child(format(row.data())).show();
    })
    table.on('stateLoaded', (e, settings, data) => {
        for(var i = 0; i < data.childRows.length; i++) {
            var row = table.row(data.childRows[i]);
            row.child(format(row.data())).show();
        }
    })
});

});

function format ( d ) {
    return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
        '<tr>'+
            '<td>Estado:</td>'+
            '<td>'+d.des_estado+'</td>'+
        '</tr>'+
        '<tr>'+
            '<td>Municipio:</td>'+
            '<td>'+d.des_municipio+'</td>'+
        '</tr>'+
        '<tr>'+
            '<td>Nivel de Estructura:</td>'+
            '<td>'+d.nivel_estructura+'</td>'+
        '</tr>'+
    '</table>';
}
3
  • ¿Podrías agregar un snippet (a través del botón que indica <>) con datos de ejemplo, para poder reproducir el problema?
    – padaleiana
    Commented el 13 feb. a las 19:18
  • Disculpa ¿como se hace eso? Commented el 14 feb. a las 0:18
  • En el cuadro donde editas la pregunta hay un botón que aparece con el ícono de <>. Allí agregas el HTML, CSS y JS necesarios para ejecutar tu código, sin olvidar las librerías/bibliotecas necesarias. Tus datos de ejemplo deberían ser un ejemplo con datos de prueba de tu json, y en vez de pasar el parámetro "ajax", debes pasar el parámetro "data". Los ejemplos puedes encontrarlos en la documentación.
    – padaleiana
    Commented el 14 feb. a las 9:59

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.