<input id="chk" önclick="enableFilter();" type="checkbox" name="chk" />Enable Filter
When I was writing a web application, I needed a way to filter a large table in a simple manner. The users of the application are used to the auto filtering in MS Excel, so I wanted my filter to have the same look and feel.
- Once a column is filtered, the dropdown boxes for the rest of the columns are adapted to the changes. Just like the auto filter in Excel works!
- If a row has the class
noFilter, the row will not be touched by the filter.
Using the code
Using the code is very simple. Just include the script to the page:
And activate the filter in the
<body onload="attachFilter(document.getElementById('tbl'), 1)">
attachFilter expects two parameters:
- The table object to attach the filter to.
- The row number at which the filter row should be inserted.
The script was initially written for IE. I did test it successfully on Firefox, but I do not know if the script works for Netscape browsers.
- 2005/07/27: First version.