jquery - datatables buttons print customize

llamar datatable al hacer clic en el botón

Question

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}]

Answer 1

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

Answer 2

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
})