Jeztah wrote:
> Good morning....
> I have a site that can be heavy server load and decided to try and
> take out some filtering on a page..
> Example. I have a page with a table of search results and would like
> to be able to put client side searching (ala Crtl+f on firefox)....
> What i would like to do is make the rows not matched less opaque in
> the table so the rows that matched the string found stand out more...
> Anyone done this before or know of a good resource i can look at to
> get me started....
> Of course the other way is to do an ajax request for the filter but i
> dont want to load the server to much!....

I wrote similar functionality for our intranet system. I can't share 
the code (contract does not allow me to), but I'll give you some tips.

I made a class to which I pass an ID/references to the filtering 
(empty) <select> elements, each of them along with css selector of 
corresponding table cells, and a reference to function which gathers 
their values and labels for values.

The configuration array looks like this:
[ { selectElem: 'id-of-select',
     columnSelector: '#myTable>tbody.content>tr>td.filteredCell_year',
     getValue: function (cell) {
        var result = cell.innerHTML.stripTags();
        return { value: result, label: result.escapeHTML() } ;
    { filter field...}

Then the initialize() function iterates over the array, for each 
select element it executes gavers the cells using the selector, and 
for each cell it gets the values, I then filter the values so I keep 
only the uniqe entries. The values are then .map()'ed to new 
Options(entry.label, entry.value) and added to the corresponding select();

then, the initialize() attaches an change observer to the form 
containing the  filtering selects, so when any of the selects is 
changed I run the selector again and check if the value of the cell is 
equal to the selected one. If so i .show() the row, else - I .hide() it.

I might be not optimal approch, as I gather the cells values on each 
change, but for our ca 100 rows tables I is fast enought, so I don't 
care (yet). I'll optimize when necessary.

I didn't bother to create the selects dynamically, but it would be 
possible to achieve that.

A good read through the Enumerable documentation will be helpful while 
writing this function.

Hope this helps,

You received this message because you are subscribed to the Google Groups 
"Prototype &" group.
To post to this group, send email to
To unsubscribe from this group, send email to
For more options, visit this group at

Reply via email to