First you can add a form in html before the datatable. This form contains an input field for each column to filter.
For example :
<form id="rozreport_filter_form" class="zdk-form">
<input type="text" name="date_visit_filter" placeholder="dare work">
<input type="text" name="model_fr_filter" placeholder="models">
<input type="text" name="sn_fr_filter" placeholder="serial number">
</form>
Next add an event handler for the change events applied to the filter input fields.
For example :
$('#rozreport_filter_form').on('change', 'input', function(evt) {
const filters = {};
const dateVisitVal = $("#rozreport_filter_form input[name=date_visit_filter]").val();
const modelVal = $("#rozreport_filter_form input[name=model_fr_filter]").val();
const snVal = $("#rozreport_filter_form input[name=sn_fr_filter]").val();
if (dateVisitVal !== '') {
filters.dateVisit = dateVisitVal;
}
if (modelVal !== '') {
filters.model = modelVal;
}
if (snVal !== '') {
}
// Filter values are sent to the controller action in JSON format
$("#rozreport_table").zdkdatatable('filterRows', JSON.stringify(filters));});
Finally, you can retrieve the filter values in your PHP controller action.
For example :
static protected function action_data() {
$request = new \Request();
// Filter values are in JSON format so they have to be decoded first...
$criteria = json_decode($request->search_criteria, TRUE);
if (is_array($criteria) {
// Value for date visit
$dateVisitVal = $criteria['dateVisit'];
// Value for model
$modelVal = $criteria['model'];
// Value for serial number
$snVal = $criteria['sn'];
// Next, apply these filters to your SQL query ...
}
}
Hoping to have helped you,
Pascal