searchPanes load previously saved selected filters
searchPanes load previously saved selected filters

Hi. So I am trying to implement an option for user to save his selected searchPanes filters for later use. I have everything working except loading those filters into searchPanes. My approach was to add "selected" class to the filter and then simulate a click (.click()) to trigger search in the table. But I'm failing to do that. Am adding a class to the tr element inside specific searchPane, and then doing .click() event for it.
I tried to search for other options, but found nothing similar. saveState is not an option, as user might come back months later and then wish to use his saved filters.
This question has an accepted answers - jump to answer
Answers
I would look at using
columns().search()
to get the current search terms for all the columns. You can chaintoArray()
to get a Javascript array. Like this:http://live.datatables.net/vuhegama/1/edit
Save that array where you want to persist the data. Then load the array and loop through and use
column().search()
to set the search for each column. If you have Cascade Panes setup it should work automatically. Otherwise you can usesearchPanes.rebuildPane()
after the loop to update the Search Panes.Kevin
The reason I did not use search() API in the first place is that numbering and order of columns in my table might change. So what I did to save the current search items was listen to a button click ("Save filters") and then loop through each searchPane and get all elements with "selected" and their parent (input) names and then build an object with arrays. Thus I have an object not with numbers of columns, but with names. They don't change. And then during the load filters event I loop through that object and search names of inputs and then add "selected" class and click triggers to that tr element.
So. Is there really no way to trigger a click action for searchPane? That would totally do the trick for me. Strange for me is that when I do .click() on tr element in searchPane, it does not react to that. Though my custom event listener sees that click. Why is that?
HI @meexo,
Maybe you could make use of the
searchPanes.preSelect
option?It should also be possible for you to trigger a click on the SearchPanes elements, could you please link to a test case? Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Thanks,
Sandy
I probably could set a preSelect option post table render (because user might decide to load filters like 2 minutes after the initial page and table load).
Here is a simple Fiddle. Press button "Load Filters". It adds "selected" class to "Age" searchPane (just for reference) and then triggers a click. But table does not filter. And if you comment out "addClass" line, then even the class is not being added to that element.
Link: https://jsfiddle.net/8f7zLo9e/
Maybe just use the
select()
API. For example:https://jsfiddle.net/qhavf29z/
Kevin
Yes! This looks promising! Thank you