Comments on: jQuery Column Filters

By: Tom Coote

Tom Coote — Mon, 05 Jul 2010 12:59:19 +0000

Hi, it’s not very complicated, however a solution on the server will be different per server technology that you use. I basically take all the text input into the filter boxes when the user is typing and send them to the server as a JSON string via AJAX using jQuery. Then the server parses the filter text and rebuilds rows for the table, usually from a cached set of data. When the server returns the result I replace the table rows in the table with the new ones. It isn’t possibly to detail the code in these comments and as I’ve said the server side part would differ depending on technology. Best way is to try it.

By: Matt

Matt — Mon, 05 Jul 2010 08:36:25 +0000

Hi. I’m interested in your custom solution too. I have a table of about 1500 items, but like your filtering idea. It’s just too slow, though.

By: sai sharan

sai sharan — Thu, 01 Jul 2010 15:11:34 +0000

Hi,

thank you for your reply, i am interested in your custom solution. how can i know more details about it?

By: Tom Coote

Tom Coote — Thu, 24 Jun 2010 08:14:25 +0000

I don’t use it on tables that have above 300 – 500 rows because of this. I would recommend a different solution for larger grids. I have a custom solution that filters data on the server then sends back the new table rows.

By: sai sharan

sai sharan — Thu, 24 Jun 2010 03:01:29 +0000

Hi,

Great plugin. Works great. Especially with small data sets.

But for data sets of 1500 to 2000, the grid takes a whole 3:30 minutes to 4 minutes. And if you do a very general filter on the column like just type “a” or “as” .. something like that .. ie 6 does not respond. So do you have any suggestions on improving the performance to use it for large data sets in IE 6.

Thanks.

By: Tom Coote

Tom Coote — Fri, 11 Jun 2010 17:13:58 +0000

Yeah that’s it. That is how I style them when I use the plugin. If you are able to make your work available on the net then I could take a look for you.

By: Mateo

Mateo — Fri, 11 Jun 2010 17:08:03 +0000

I’m not sure that works. I found that all the inputs have the class name “_filterText”. My css is below.

._filterText {
width:100%;
}

This doesn’t work… Any suggestions?

By: Tom Coote

Tom Coote — Fri, 11 Jun 2010 16:38:13 +0000

You can change the width of inputs using CSS. The best way is to set them to 100% because then they don’t push the columns wider. The inputs are given class names that you can apply styles to but I can’t remember what they are off the top of my head. Use firefug to find out what the class names are.

By: Mateo

Mateo — Fri, 11 Jun 2010 16:28:53 +0000

How do you change the width of the Input tags?

By: dimitris

dimitris — Wed, 09 Jun 2010 11:44:28 +0000

Awesome!