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.
// 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>';
}
<>
) con datos de ejemplo, para poder reproducir el problema?<>
. 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.