How to add a Dropdown filter
How to add a Dropdown filter
latinunit
Posts: 73Questions: 12Answers: 0
Given the following array of objects data structure
[{"blackList":"0","cmOneID":"666666","firstName":"David Llanos","id":"13251376","jurisdiction":"SCPB - LON","relationshipManager":"Adam Cavalier","_schema":"nms:recipient"}]
My init script
document.controller.setValue('/ctx/vars/recipients', JSON.stringify(response.data));
$('#recipients').DataTable({
data: response.data,
deferRender: true,
columnDefs: [
{ title: 'First Name', targets: [0]},
],
columns: [
{ data: 'firstName' }
],
});
I am just showing the first Name on my table, I was wondering how can I add a filter on the table header with a dropdownlist of data values, for example a list of all available jurisdictions?, if is not possible to populate a dropdown filter from the data source, then how to add dropdown filter with hardcoded values that can filter the table?
This question has an accepted answers - jump to answer
Answers
The easiest way to handle this is to create a hidden column for
jurisdictionusingcolumn.visible. This allows for usingcolumn().search()to search thejurisdictiondata. You can modify this example to build the select list. I think the following two changes should work:.columns()to.columns( [1] )where1is thejurisdictioncolumn. See thecolumn-selectordocs for details..appendTo($(column.footer()).empty())to use the selector of the element where you have the select input. More specifically changecolumn.footer()to the selector.Like this for example:
Kevin