Add Column Filtering on specific columns

careywalker

I have the example for DataTables Individual Column Filtering working. I don't want to filter on all columns in the DataTable, I only want to filter on specific columns in the DataTable. Does anyone know how to do this?

allan

Sure - just modify the example so that the input elements are added to all columns :-). There was a pull request which makes this slightly easier yesterday as well which you might be interested in: https://github.com/DataTables/DataTables/commit/a5c80d47114e9cd26e9c4c98f0ec193875fba0bf

Allan

careywalker

Allan, thanks for getting back to me. My question was not worded very well so I will try again. What I meant to ask is... currently, when you want to add filtering to columns using select lists you do the following:

--the code below is from the Example: http://datatables.net/release-datatables/examples/api/multi_filter_select.html

$("tfoot th").each( function ( i ) {
this.innerHTML = fnCreateSelect( oTable.fnGetColumnData(i) );
$('select', this).change( function () {
oTable.fnFilter( $(this).val(), i );
} );
} );

This will add a filtering select list to each column. What I am asking is how to add the filtering select list to specific columns. My data table has 10 columns and I only want to add the filter select lists to 4 of those columns.

careywalker

Update on this...

I added an ID value to each of the elements as in:
















and then I use the id value to add the filtering select lists to the required columns:

$("thead td").each(function (i) {
if (this.id == 3 || this.id == 4 || this.id == 5 || this.id == 6 || this.id == 8 || this.id == 9 || this.id == 11) {
this.innerHTML = fnCreateSelect(oTable.fnGetColumnData(i));
$('select', this).change(function () {
oTable.fnFilter($(this).val(), i);
});
}
});

I would be happy to know if there is a better way of doing this, maybe using the index value of "this" to decide whether or not to add a filtering select list to a column.

careywalker

After writing the last comment I thought I would go back and try something else and evaluating for the value of i works as well:

$("thead td").each(function (i) {
if (i == 2 || i == 3 || i == 4 || i == 5 || i == 7 || i == 8 || i == 10) {
this.innerHTML = fnCreateSelect(oTable.fnGetColumnData(i));
$('select', this).change(function () {
oTable.fnFilter($(this).val(), i);
});
}
});