Column Specific Input Filters in Header

Column Specific Input Filters in Header

jneilliiijneilliii Posts: 15Questions: 0Answers: 0
edited July 2010 in General
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?

Replies

  • jneilliiijneilliii Posts: 15Questions: 0Answers: 0
    edited July 2010
    I was able to resolve this slightly by putting the filtered text into inputs in the footer on submit. The code below is now working for me as a temporary work around. It needs to be added after Fixed Header is initialized in the document ready function.
    [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]
This discussion has been closed.