PDA

View Full Version : Filtered Grid for Ext 1.1



jclawson
27 Aug 2007, 2:04 PM
We have created a filtered grid extension for Ext 1.1.

Please see the post here: http://extjs.com/forum/showthread.php?p=57851#post57851

Here is a link to the example and source:

http://ccinct.com/lab/filter-grid

Please keep in mind that this was created for our own internal purposes first. It is not "ux" ready in the sense that it may contain Prototype JS specific calls. Also, this extension depends heavily on backend implementation.

We have provided partial source that will help you translate the filter data into MySQL SQL but you will have to edit the php classes to use your own database abstraction layer. As stated in the referenced post, this php code was translated from Java so it may be a little "messy".

Our hope is that Jack will try to incorporate this, and/or expand upon it into Ext 2.0.

I will try to respond to any questions, support requests, or feature requests but support is very limited.

JeffHowden
27 Aug 2007, 4:14 PM
Very nice. I can hardly wait to see this in UX quality. I agree that this is a worthwhile configurable addition to 2.0.

brian.moeskau
27 Aug 2007, 8:18 PM
For those coming to this post out of context (like I did) right-click on the grid headers in the example for custom filtering.

Nice job! Couple of little problems I noticed:


Filter by multiple sizes, only the last one checked displays
Filter by visible flag, then you cannot change it to the other value until you remove the filter


I think Jack has something very similar to this planned -- not sure if it will be in 2.0 or not yet.

fangzhouxing
27 Aug 2007, 8:40 PM
jclawson,you are great! This is the very functionality of grid I wanted.

jclawson
28 Aug 2007, 7:13 AM
jclawson,you are great! This is the very functionality of grid I wanted.

Thank Ambience. This was his brainchild.

jclawson
28 Aug 2007, 7:20 AM
For those coming to this post out of context (like I did) right-click on the grid headers in the example for custom filtering.

Nice job! Couple of little problems I noticed:


Filter by multiple sizes, only the last one checked displays
Filter by visible flag, then you cannot change it to the other value until you remove the filter


I think Jack has something very similar to this planned -- not sure if it will be in 2.0 or not yet.

Yeah we noticed the bugs.

I know Jack was thinking about something similar. I am sure he would have some improvements to add. It would be nice if he could leverage some of this code. (Mostly so we don't end up having to rewrite a lot of our code ;)...) Obviously it is up to his discretion of whether it meets his standards or what he has planned, but I think the javascript is pretty flexible.

And like I mentioned, we have back end code in PHP and Java. Using it is as easy as instantiating an object (once the proper database library is substituted). I hope one day, if I ever get free time, I will pull out the database calls from the classes and make a few other improvements... like changing the HAVING clause to a WHERE clause.

ambience
28 Aug 2007, 8:52 AM
Filter by multiple sizes, only the last one checked displays
Filter by visible flag, then you cannot change it to the other value until you remove the filter


Both are now fixed, thanks for catching that.

jack.slocum
30 Aug 2007, 3:41 AM
This is really nice. Any chance of porting it to 2.0? I think it would make an awesome UX plugin!

sjivan
30 Aug 2007, 3:55 AM
Would be nice to have such functionality in the core itself :)

jack.slocum
30 Aug 2007, 4:01 AM
Would be nice to have such functionality in the core itself :)

There are too many implementation specific details (e.g. server vs local, headers vs menus, etc). It would result in a significant amount of code to handle all the various scenarios. Specific versions can be much smaller and more easily customized.

That's one major change for 2.0 - more things implemented as example plugins to avoid core bloat.

sjivan
30 Aug 2007, 4:13 AM
Makes sense. For example I actually prefer having a filter field in the header region itself as I feel it is easier to work with from a usability perspective.

Sanjiv

MaxT
30 Aug 2007, 7:24 AM
This is a nice implementation of grid filtering. Easy to use.

I've been working on a similar filtering system that uses an extra header row. Clicking the filter brings up a dialog that allows you to edit it. Might work on a live demo one day if I have time. Heavily dependent on server side code as well for state saving, SQL filtering, etc, so maybe not that useful as an extension.

Max

ambience
30 Aug 2007, 8:13 AM
This is really nice. Any chance of porting it to 2.0? I think it would make an awesome UX plugin!

Thanks =) When we get to a point in our development cycle where we can see if 2.0 will play nice with our existing code I will most certainly try to port it. Provided conversion to 2.0 will still allow us to meet our release dates (i.e. lots of **** doesn't break ;) ). However, this is still a few months off. If we can't make the switch till late January I'll try to cook up a 1.1 UX quality (prototype free) version some time in the interim. At that point I'll try to add it to the wiki with some documentation on the specifics of the filters and how they communicate with the server.

I should also mention that I've bundled GridStateManager.js with the code (not demoed) which is a very slightly modified version of the code found at http://extjs.com/forum/showthread.php?t=5219&highlight=grid+state . With it, you can make header location, size, visibility, and filter states persist across page loads.

violinista
2 Sep 2007, 11:42 PM
Nice thing.

One suggestion:: for better usability, you should provide not only information what column is grid filtered by, but filter contents, too. For example, on the place above filtered column should stay filter text. I'm working on some similar filtering routine, it should be posted soon.

ambience
5 Oct 2007, 5:45 PM
New thread for the 2.0 version (grid plugin): http://extjs.com/forum/showthread.php?p=70377

navidi
26 May 2008, 1:42 AM
We have created a filtered grid extension for Ext 1.1.

Please see the post here: http://extjs.com/forum/showthread.php?p=57851#post57851

Here is a link to the example and source:

http://ccinct.com/lab/filter-grid

Please keep in mind that this was created for our own internal purposes first. It is not "ux" ready in the sense that it may contain Prototype JS specific calls. Also, this extension depends heavily on backend implementation.

We have provided partial source that will help you translate the filter data into MySQL SQL but you will have to edit the php classes to use your own database abstraction layer. As stated in the referenced post, this php code was translated from Java so it may be a little "messy".

Our hope is that Jack will try to incorporate this, and/or expand upon it into Ext 2.0.

I will try to respond to any questions, support requests, or feature requests but support is very limited.

Hi jclawson,

I see that you update the 'filtered grid extension for Ext 1.1' into Ext 2.
Any hope that I can have the previous version (extension for Ext 1.1) ? My application is based on Ext 1.1.1 .

Regards.

jclawson
26 May 2008, 8:52 AM
No sorry. The grid filter is now part of the Ext 2.1 core. ExtJS is responsible for developing it.