individual column filter using select with hidden colmn
individual column filter using select with hidden colmn
Hi,
I have got column filtering with select working fine, and have placed them in the thead by placing the input elements with td's in the thead:
[code]
[/code]
This works absolutely fine. However, when I change the visible property of the first column to 'false' the select menus do not appear at the top of the correct column, they appear one along to the right. They have the correct data displayed, but just not in the correct column. The filtering works aswell when you select an option from the dropdown
I've searched the forum and have found what I think is a similar problem when using the input fields for filtering but cannot see where to add the fix Alan describes.
[code]
$("tfoot input").index(this)+1
[/code]
I think here needs to be something added here to sort out the selects and i tried to 'skip' the first column by adding a wee if/else check for the index :
[code]
/* Add a select menu for each TH element in the table footer */
$("thead td").each( function ( i ) {
if(i!=0 ){
this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i) );
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
}
} );
[/code]
but this still writes out the select box in the wrong column.
Any ideas?
Thanks for any help
Euan
I have got column filtering with select working fine, and have placed them in the thead by placing the input elements with td's in the thead:
[code]
[/code]
This works absolutely fine. However, when I change the visible property of the first column to 'false' the select menus do not appear at the top of the correct column, they appear one along to the right. They have the correct data displayed, but just not in the correct column. The filtering works aswell when you select an option from the dropdown
I've searched the forum and have found what I think is a similar problem when using the input fields for filtering but cannot see where to add the fix Alan describes.
[code]
$("tfoot input").index(this)+1
[/code]
I think here needs to be something added here to sort out the selects and i tried to 'skip' the first column by adding a wee if/else check for the index :
[code]
/* Add a select menu for each TH element in the table footer */
$("thead td").each( function ( i ) {
if(i!=0 ){
this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i) );
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
}
} );
[/code]
but this still writes out the select box in the wrong column.
Any ideas?
Thanks for any help
Euan
This discussion has been closed.