Thursday, June 22nd, 2006

Script.aculo.us Datagrid

Category: JavaScript, Library, Prototype

Finetooth has created a Reorganizable DataGrid built on Ajax / Smarty / Prototype / Scriptaculous.

The online test allows you to build a datagrid on the fly and play around with moving headers, sorting, and the usual.

There is a README but you need to download the puppy and play around to work out how to use this yourself.

It doesn’t seem to be as simple as a Dojo widget.

Script.aculo.us DataGrid

Posted by Dion Almaer at 1:14 am
15 Comments

++++-
4 rating from 79 votes

15 Comments »

Comments feed TrackBack URI

Nice component, I especially like the resizing of columns.

Is there keyboard support? At least the demo does not allow any keyboard interaction = poor accessibility

Comment by Sebastian — June 22, 2006

Vertical scrolling does not work in FF 1.5.0.4.

Comment by atany — June 22, 2006

Very nice, for just under 400KB!!!

NOT!!!

Comment by Lon — June 22, 2006

Vertical scrolling works fine for me in FF 1.5.0.4. Must just be your browser/system.

They have a ways to go before competing with the likes of ActiveWidget, but here’s hoping they succeed.

Comment by Reader — June 22, 2006

>400K? People ought to be ashamed of themselves for either sharing such a demo or posting positive comments on it.

Lamers.

Comment by Martin — June 22, 2006

I was waiting for a datagrdi without having to use rico (I want to use scriptalicious), but this seems to buly for my liking. Back to the rico grid.

Comment by Jon — June 22, 2006

Lindsay at Finetooth has done a great job here. I took his code a few months back and have used as the base for a straight XHTML/CSS/Javascript version of the data grid for client of ours.

Comment by Charles C — June 22, 2006

I get some JavaScript errors on WinXP IE6.

Comment by Michael Schwarz — June 22, 2006

Datagrids are such a crucial components for web apps. I really wish there were some better ones out there.

Finetooth’s looks a bit large but its a nice start.

Activestate’s licensing is crap.

Lindsay’s is a nice start.

If you want to see the best “mostly” open grid right now, check out Scand’s: http://scbr.com/docs/products/dhtmlxGrid/

Scand has tons of features and includes editing. It’s a little heavy on XML for my taste, the code needs some cleanup, but the event based API it top notch and has the most functionality of anything I’ve seen.

Comment by JCA — June 22, 2006

Stop bashing the size of the code, jerks. If you’d looked at any of the code, yo’d realize that (wait for it) its commented. Now, I know that you guys don’t comment your code (because you’re manly men, and everyone knows what you meant by a = Math.max((q-- ? q : -72), 49) anyway) but its way easier to maintain and learn from if there’s commenting. I’m pretty sure that at least half of the attributed file size is comments. And for the record, I hate all JS tables. Go server-side …

Comment by Dan — June 22, 2006

Hey – glad to see a firestorm brewing about a datagrid. Since most of the complaints revolve around size I thought I’d share this link: XSLDataGrid

I’m working right now on a rewrite that does not use smarty, but rather does XSLT either on the client (using Sarissa) or on the server. Doing the transform on the client actually works out remarkably well. And the only real requirement is semantically nice xhtml – so see what you think of the new take on it. I think that this approach is going to prove rather interesting for widget creation and instantiation. I’d really like to get some other people working with and on this code too. More brain = better code.

Comment by Lindsey Simon — June 22, 2006

I don’t think script size is a big issue. since using a datagrid is mostly for web/intranet application. It will just take sometime for the first time loading going to take sometime, but it will be fine after. For normal pages just to display data, a server-side solution seem more reasonable.
I saw a lot of the grids out there. I still like the one from domapi (http://www.domapi.com/build/tests/HTML_4.01_Transitional/listgrid_(edit).htm?theme=system&skin=false&lang=eng) bit more.

Comment by Henry — June 22, 2006

[…] Script.aculo.us Datagrid: “Finetooth has created a Reorganizable DataGrid built on Ajax / Smarty / Prototype / Scriptaculous. […]

Pingback by Script.aculo.us Datagrid — June 24, 2006

hi,
i’m using asp.net 2.0 in tat i using gridview
i’m trying to load 15,000 records to gridview.it takes 3 minutes to load
can anybody suggest a good solution for me

Comment by ranjith — July 6, 2006

>>> i’m trying to load 15,000 records to grid view. it takes 3 minutes to load, can anybody suggest a good solution for me

Yeah, JACKASS, don’t load 15,000 rows.

Comment by Gary — January 24, 2007

Leave a comment

You must be logged in to post a comment.