Column Specific Input Filters in Header
Column Specific Input Filters in Header
I have been trying to get the filter function to work in the latest stable DataTables 1.6.2 using individual inputs in the column headings. I am able to get the filter to work as expected, but when the server-side returns the results, the inputs lose the values entered into the input and you can't tell what you are filtering on. I am using the Fixed Header plugin, which I think may be the culprit, as it clones the header from original html and redraws it. Is there any way to get the entered data to display in these inputs on redraw?
This discussion has been closed.
Replies
[code]
$('thead input').keydown( function (event) {
if(event.keyCode==13){ //filter when enter is pressed.
oTable.fnFilter(this.value, $("thead input").index(this)-1);
$('tfoot input').eq(($('thead input').index(this)-4)).val(this.value); //offset by number of inputs in the header, as Fixed Header doubles the thead. In my example there are 4 columns being filtered.
this.blur();
}});
$('thead input').each(function(i){
asInitVals[i] = this.value; //populate an array with initial values.
});
$('thead input').focus(function(){
if(this.value == asInitVals[$('thead input').index(this)]) {
this.value = '';
}
});
$('thead input').blur( function(){
if (this.value == '') {
this.value = asInitVals[$('thead input').index(this)]; //restore header values if nothing was entered.
$('tfoot input').eq(($('thead input').index(this)-4)).val(this.value); //offset by number of inputs in the header, as Fixed Header doubles the thead. In my example there are 4 columns being filtered.
}
});
[/code]