Hello everyone, I'm having a problem with the nested datatables, the child rows are showing all the data, but I want each information to stay in its particular parent row, can any one help me? my code below...
var oInnerTable;
$(document).ready(function() {
TableHtml = $('#example').html();
var table = $('#example').DataTable({
"bProcessing": true,
"ajax": {
"url": 'forms/customer-details/jsonData.php',
"type": 'POST',
"data": {
"idCustomer": <?php echo $idCustomer; ?>
}
},
"scrollX": true,
"language": {
"sUrl": "../plugins/datatables/Portuguese-Brasil.json"
},
"aLengthMenu": [[10, 20, 30, 50, -1], [10, 20, 30, 50, "Todos"]],
"aoColumns": [
{
"class": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
},
{"mData": "NOTA"},
{"mData": "NRO_NOTA"},
{"mData": "EMISSAO",
render: function(data, type, row) {
var dateSplit = data.split('-');
return type === "display" || type === "filter" ?
dateSplit[1] + '/' + dateSplit[2] + '/' + dateSplit[0] :
data;
}
},
{"mData": "QUANTIDADE1",
render: $.fn.dataTable.render.number()},
{"mData": "BRUTO",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "VALOR_DESCONTO1",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "TOTAL1",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "VALOR_IPI1",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "VALOR_SUBST",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "TOTAL_NF",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "PRECO_MEDIO",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "REPRES_NOME"},
{"mData": "VENDEDOR_NOME"},
{"mData": "OP_NOME"},
{"mData": "FRANQUEADO_NOME"},
{"mData": "CARTEIRA"},
{"mData": "TRANSP_NOME"},
{"mData": "RASTREAMENTO_CORREIO"},
{"mData": "CONHECIMENTO"},
{"mData": "VALOR_FRETE",
render: $.fn.dataTable.render.number('.', ',', 2, 'R$ ')},
{"mData": "PERCENTUAL",
render: $.fn.dataTable.render.number('.', ',', 2, '% ')},
{"mData": "DESCRICAO"},
{"mData": "DATA_OCORRENCIA"}
],
"order": [[1, "desc"]]
});
var table = $('#example').DataTable();
$('#example tbody').on('click', 'td.details-control', function() {
var tr = $(this).closest('tr');
var row = table.row(tr);
if (row.child.isShown()) {
row.child.hide();
tr.removeClass('shown');
} else {
row.child(format()).show();
tr.addClass('shown');
oInnerTable = $('#detalhes').DataTable({
"bProcessing": true,
"ajax": {
"url": 'forms/customer-details/jsonNota.php',
"type": 'POST',
"data": {
"idCustomer": <?php echo $idCustomer; ?>
}
},
"language": {
"sUrl": "../plugins/datatables/Portuguese-Brasil.json"
},
"aLengthMenu": [[10, 20, 30, 50, -1], [10, 20, 30, 50, "Todos"]],
"aoColumns": [
{"mData": "NOTA"},
{"mData": "COD_PRODUTO"},
{"mData": "DESC_PROD"},
{"mData": "QUANTIDADE"},
{"mData": "UNITARIO"},
{"mData": "PCT_IPI"},
{"mData": "VALOR_IPI"},
{"mData": "DESCONTO"},
{"mData": "VALOR_DESCONTO"},
{"mData": "DESC_UNITARIO"},
{"mData": "TOTAL"}
],
"order": [[0, "desc"], [1, "asc"]]
});
}
});
});
