jquery - datatables buttons print customize
llamar datatable al hacer clic en el botón (2)
He llegado hasta aquí,
mi JSON es incompatible con la tabla de datos
Mensaje de error,
Advertencia de DataTables: id de la tabla = RegSrc - Parámetro desconocido solicitado ''Filenum'' para la fila 0, columna 1
Por favor ayuda
<table id="RegSrc" class="table table-bordered table-striped">
<thead>
<tr>
<th></th>
<th><b>File Number</b></th>
<th><b>Patient Name</b></th>
<th><b>DOB</b></th>
<th><b>Age</b></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
Código JS
var Table = $(''#RegSrc'').DataTable({
data: [],
"columns": [
{
"className": ''details-control'',
"orderable": false,
"data": null,
"defaultContent": ''<i data-toggle class="fa fa-plus-square-o text-primary h5 m-none" style="cursor: pointer;"></i>''
},
{ data: "Filenum" },
{ data: "FullName" },
{ data: "DOB" },
"columns": [{"className": ''details-control'', "ordenable": falso, "data": null, "defaultContent": ''''}, {data: "Filenum"}, {data: "FullName" }, {data: "DOB"}, {data: "Age"}],
rowCallback: function (row, data) { },
filter: false,
info: false,
ordering: false,
processing: true,
retrieve: true
})
Función de clic de botón
$("#srcmdlfrmbtn").on("click", function (event) {
var obj = {}
obj.SrchTxt = $(''#srctxt'').val(),
obj.FnameSrctxt = $(''#fnamesrc'').val(),
obj.SnameSrctxt = $(''#snamesrc'').val(),
obj.TnameSrctxt = $(''#tnamesrc'').val(),
obj.LnameSrctxt = $(''#lnamesrc'').val(),
obj.TelSrcTxt = $(''#telsrc'').val(),
obj.SSNSrcTxt = $(''#ssnsrc'').val(),
obj.EmailSrctxt = $(''#emailsrc'').val(),
obj.DOBSrcTxt = $(''#dobsrc'').val()
$.ajax({
contentType: "application/json; charset=utf-8",
url: "../CONFIG/WebSerTblsSearch.asmx/SrcTblReg",
type: "Post",
data: JSON.stringify(obj),
dataFilter: function (res) {
var parsed = JSON.parse(res);
var morp = JSON.parse(parsed.d);
console.log(JSON.stringify( morp ))
//return JSON.stringify({ data: morp });
Table.clear().draw();
Table.rows.add(JSON.stringify({ data: morp })).draw();
},
})
});
Mis resultados de JSON Array
[{"Filenum":15090248,"FullName":"Ahmad Morsi abdul fattah Abu Maizer","DOB":"05 Dec 2017","Age":0},{"Filenum":170418115,"FullName":"Ahmad Morsi abdul fattah Abu Maizer","DOB":"05 Dec 2017","Age":0},{"Filenum":170418116,"FullName":"Ahmad Morsi abdul fattah Abu Maizer","DOB":"05 Dec 2017","Age":0},{"Filenum":170227111,"FullName":"asd dsf as a","DOB":"27 Feb 2017","Age":0},{"Filenum":15112775,"FullName":"marwam saleh moh saleem","DOB":"26 Nov 2015","Age":2},{"Filenum":15112777,"FullName":"marwam saleh moh saleem","DOB":"26 Nov 2015","Age":2},{"Filenum":15120996,"FullName":"marwam mohmmad saleem","DOB":null,"Age":null},{"Filenum":160215104,"FullName":"marwam mohmmad abdul fattah Abu Maizer","DOB":"12 Mar 2016","Age":1},{"Filenum":15112270,"FullName":"mohammad j saleh raqaad","DOB":"22 Nov 2015","Age":2},{"Filenum":15112772,"FullName":"salem mohmmad john sarjes","DOB":"22 Oct 2011","Age":6}]
Cambié
Table.clear().draw();
Table.rows.add(JSON.stringify({ data: morp })).draw();
a
Table.clear().draw();
Table.rows.add( morp ).draw();
y comenzó a funcionar
Su JSON contiene dos columnas en cada fila y su tabla de datos intenta llenar cuatro columnas en cada fila, de modo que según su solicitud JSON su dataTable será la siguiente.
<table id="RegSrc" class="table table-bordered table-striped">
<thead>
<tr>
<th><b>File Number</b></th>
<th><b>Patient Name</b></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
JS:
var Table = $(''#RegSrc'').DataTable({
data: [],
"columns": [
{
"className": ''details-control'',
"orderable": false,
"data": null,
"defaultContent": ''<i data-toggle class="fa fa-plus-square-o text-primary h5 m-none" style="cursor: pointer;"></i>''
},
{ data: "Filenum" },
{ data: "FullName" },
],
rowCallback: function (row, data) { },
filter: false,
info: false,
ordering: false,
processing: true,
retrieve: true
})