Sorting a column resets my custom filter

svivian

I created a custom filter on a dataTable, like this:

[code] $('#pkfilter_type').change( function() {
oTable.fnFilter( this.value, 2 );
} );[/code]

It's a dropdown ("select" element) that filters a column from a few choices. However, when I click a header cell to sort by that column, it cancels the filter and shows every row of the table again. The dropdown still shows the item I filtered on, as if it was still applied.

Is this supposed to happen? How do I keep the filter on when other things in the table change?

If it's useful, here's the bit of my code that initialises the DataTable:

[code] oTable = $("#pokedex").dataTable( {
"aoColumns": [
{ "sType": "html", "bSearchable": false },
null,
{ "bSortable": false, "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
{ "asSorting": ["desc","asc"], "bSearchable": false },
],
"bPaginate": false,
"bAutoWidth": false,
"bInfo": false,
"bProcessing": true, // display processing banner
"aaSorting": [], // prevent default sort
"asStripClasses": [], // remove odd/even classes
"bFilter": false,
} );[/code]

svivian

OK after further research the problem appears to be caused by removing the default Filter box, i.e. this line:

[code]"bFilter": false,[/code]

With that gone, everything works as expected. This is a bug, right? Is there a way around it? I just want my custom filters and want to hide the default one.

allan

Nope not a bug :-) You've disabled filtering (bFilter: false) - so why would filtering work... :-)

The way to keep filtering enabled, is leave bFilter in its default state, and simply remove the display of the filter box from sDom: http://datatables.net/usage/options#sDom

Allan

Petr

allan: There should be note about it in documentation ....

allan

I've added a claritifcation point for this to the notes for bFilter ( http://datatables.net/usage/features#bFilter ):

"Enable or disable filtering of data. Filtering in DataTables is "smart" in that it allows the end user to input multiple words (space separated) and will match a row containing those words, even if not in the order that was specified (this allow matching across multiple columns). Note that if you wish to use filtering in DataTables this must remain 'true' - to remove the default filtering input box and retain filtering abilities, please use sDom."

Allan

svivian

"You've disabled filtering (bFilter: false) - so why would filtering work"
Well filtering itself actually DOES work, that's why it felt like a bug. It's only after trying to sort the table that the filtering stops working.

I'm also having a problem with the sDom method. I have this code:

[code]"sDom": '<"custom-filter"f>rt',[/code]

By my understanding, this should insert the filter into a div with class "custom-filter". However, I have a div with that class but DataTables instead adds a separate div with the class, rather than injecting it into the existing div. Maybe that's the intended behaviour. Is there a way to add the standard components to elements that are away from the table?

allan

Yup fair point - filtering shouldn't do anything when filtering is disabled. I hadn't really considered that fnFilter might be used hen bFilter was false! In my development version (which will become 1.7 beta 3) is to have fnFilter do nothing when bFilter is false, which makes more sense.

With your sDom code there - the filter should be inserted into the custom-filter div, but it also has it's own div (which is just part of the code), so you should get something like div.custom-filter > div.dataTables_filter > input (etc).

There is no method to put elements into the DOM in any position - just those available with sDom. However, it is trivial to allow DataTables to create its elements and then move them to where ever you want in the DOM using appendChild (etc).

Regards,
Allan

svivian

I decided to do it the original way you suggested, by hiding the standard filter control and rolling my own via text field and dropdown. Thanks for the replies, I may get round to donating at some point...