Filtering on hidden column using select box in header/footer

Suite and Optimus Suite 5
#1

I’m posting this in case it helps someone or if anyone can suggest a better way to do it.

I needed to filter rows based on 2 columns that were both hidden. The header shortcuts such as #select_filter couldn’t be used because the filtering column is not visible.

I managed to do it using custom headers this way:

    grid._in_header_custom_label = function(tag, index, data) {
        tag.innerHTML =  'Source&nbsp;<select class="dhxform_select" style="width:100px" id="src_filter" type="text"></select>';
        tag.innerHTML += '&nbsp;&nbsp;Target&nbsp;<select class="dhxform_select" style="width:100px" id="tgt_filter" type="text"></select>';
    };
    grid.attachHeader('dummy,dummy,#custom_label,#cspan,#cspan');
...
...
    grid.load("data.php", function(){ 
        grid.makeFilter('src_filter', 0); // filter rows using source select box
        grid.makeFilter('tgt_filter', 1); // filter rows using target select box
    });

makeFilter only worked when I put it inside the “grid-loaded” event handler of grid.load. Or else it wasn’t finding the select elements by their ids.

                           mfyahya