DataTables select filter not filtering data

sjw01

Link to test case: https://live.datatables.net/fiyoricu/2/
Error messages shown: NA
Description of problem:
I have created a DataTable which I use AJax to retrieve the data into a json/javascript variable which is passed to the DataTable to show the data - no problems.

I have used the example provided here: https://datatables.net/examples/api/multi_filter_select.html to add a select dropdown to filter table options.
I then expanded the filter to search for multiple values allowing the selects to be defined as multiple.
I then added selectize to the select to try and make the select experience less clunky

I was having problems with selectize initialising (I was calling selectize and it appeared the table wasn't ready so it wasn't being selectized) - so I tried to use initComplete and I have made changes today to get the select dropdowns to selectize succesfully BUT now, the filters are not filtering.

Problem: The filters are no longer filtering after changing when and how the select options are created (inside initComplete) and when selectize() is called and I am NOT getting any errors in the console to help debug

allan

It appears that Selectize doesn't trigger the change event - you can confirm this by adding console.log('val', $(this).val()); into your .on('change', ...) function for the select.

Instead it will trigger its own onChange callback - see their docs here.

I haven't updated your code to make the filtering happen in onChange, but you can see that effect here. I can't see an obvious way to make it trigger change on the original select. You might need to ask the Selectize devs about that.

The alternative is to do the filtering in the onChange callback, rather than setting it up with an event (e.g. initialise a Selectize inside the every loop for each column that has a select.

Allan

sjw01

I have just compared older versions which were working and realised that a few weeks back I updated selectize from v0.12.4 to v0.15.2 and obviously didn't properly test. v0.12.4 works as expected and triggers the change event. v0.15.2 is not triggering the event.

allan

Interesting. I wonder if it was this change that causes that.

Either way, good to hear you've got a working solution now.

Allan

sjw01

Thanks @allan.
There was a UI bug in 0.12.4 which prompted me to upgrade.
The bug I had was fixed but now, this is more than a little UI bug!

allan

Here is how it could be done with initialisation of Selectize inside the loop: https://live.datatables.net/bixuqage/3/edit .

Allan