individual column filtering and server side generate one ajax call per column
individual column filtering and server side generate one ajax call per column
jsopesens
Posts: 1Questions: 1Answers: 0
I'm using server side obtaining records, but when I want to use column filtering I have several errors.
When I write something in the input field, ajax generated one petition per column, making the process slow (like 70 seconds) and returning nothing because ajax is searching the same input on 37 columns.
How can I make only one petition for the column I filled?
Here the js Code
//GENERATING INPUT FIELDS ON FOOTER
$('#tableRecords tfoot th').each(function () {
var title = $(this).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
//PASSING FOOTER TO THEAD
var r = $('#tableRecords tfoot tr');
r.find('th').each(function () {
$(this).css('padding', 1);
});
$('#tableRecords thead').append(r);
$('#search_0').css('text-align', 'center');
//AJAX CALL
let site_id = document.getElementById('site_id').innerHTML;
let role = document.getElementById('role').innerHTML;
var table = $('#tableRecords').DataTable({
"orderCellsTop": true,
"processing": true,
"serverSide": true,
"columnDefs": [{
"render": createManageBtn,
"data": null,
"targets": [0],
}],
"ajax": {
"url": url + "site/getRecords",
"dataType": "json",
"type": "POST",
"data": function (d) {
d.site_id = site_id,
d.role = role
}
}
})
//COLUMN FILTERING CODE
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change clear', function () {
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});
});