Hiding columns with aoColumnDefs or with ColVis is not compatible with Multi_Filter Example
Hiding columns with aoColumnDefs or with ColVis is not compatible with Multi_Filter Example
DaveB
Posts: 3Questions: 0Answers: 0
Apparently the index used for the filter boxes in the multi_filter example and the index used by DataTables for the table columns are not the same. When a column is hidden it is dropped from the index for the filter boxes but retained in the table. For example adding this
[code]"aoColumnDefs": [{ "bVisible": false, "aTargets": [1] }][/code]
to the multi_filter.html example results in the second displayed filter box acting acting upon the hidden second column and the third displayed filter box acting upon the second displayed column, and so on.
The same thing happens if ColVis is used to hide columns with the multi_filter example.
Is there any suggested patch or work-around to resolve this?
Thanks for any help,
DaveB
[code]"aoColumnDefs": [{ "bVisible": false, "aTargets": [1] }][/code]
to the multi_filter.html example results in the second displayed filter box acting acting upon the hidden second column and the third displayed filter box acting upon the second displayed column, and so on.
The same thing happens if ColVis is used to hide columns with the multi_filter example.
Is there any suggested patch or work-around to resolve this?
Thanks for any help,
DaveB
This discussion has been closed.
Replies
I use:
Individual column filtering (using "select" elements)
Maybe anyone else tackled that?
[code]
oTable.fnFilter( this.value, $("tfoot input").index(this) );
[/code]
The thing with this is the index() function. It's using the visible index, not the column index. So when you hide a column - it gets thrown off. One option is to use DataTables' internal function called "_fnVisibleToColumnIndex" which will take the visible index and convert it to a column index - Call it like:
[code]
oTable.fnFilter( this.value, oTable.oApi._fnVisibleToColumnIndex( $("tfoot input").index(this) ) );
[/code]
Allan
This sounds promising, but when I use the suggested code in multi_filter.html I get an error:
oSettings.aoColumns is undefined
for ( var i=0 ; i
Figured it out. The call was missing a first parameter. This works:
[code]oTable.fnFilter( this.value, oTable.oApi._fnVisibleToColumnIndex( oTable.fnSettings(),$("tfoot input").index(this) ) );[/code]
Dave
Allan
I use ColVis and multi filter together with bStateSave option set to true like this:
fnInitComplete function of my DataTable (to set saved values of multi filter inputs):
[code]
"fnInitComplete": function() {
var oSettings = this.fnSettings();
for ( var i=0 ; i0){
var visibleI = this.oApi._fnVisibleToColumnIndex( oSettings,i);
if($("thead input")[i]) {
$("thead input")[i].value = oSettings.aoPreSearchCols[visibleI].sSearch;
$("thead input")[i].className = "";
}
}
}
}
[/code]
and a listener of inputs:
[code]
$("thead input").keyup( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, oTable.oApi._fnVisibleToColumnIndex( oTable.fnSettings(),$("thead input").index(this) ) );
});
[/code]
The problem occurs when I hide a column, refresh page, show the hidden column and try to filter. The keyup function does not work for this column now, because it did not exist in the time on page creation/rendering.
Any suggestion how to resolve this?