Preview: Ext GWT Grid, Grid Plugins, and EditableGrid

July 23, 2008 by Darrell Meyer

Ext GWT 1.1 development is moving along nicely and includes a new Grid component. Grid is based on the Ext JS Grid and will support the same features including grid plugins, grouping, totaling, and inline editing.

Grid vs. Table

One if the biggest differences between Table and Grid is performance. Table does not scale well with a large number of rows. Grid renders its data much faster and can handle larger data sets with noticeable differences in initial rendering times.

Table is a container of TableItems which work without a model. TableItems deal directly will cell values. Model support is added using a TableBinder which works with a Store. With Grid, there are no child components and Grid works with the Store directly. This design simplifies use and the binder is no longer needed.

Grid Plugins

1.1 adds support for component plugins with the new ComponentPlugin interface which are objects that can “plug” into a component’s lifecycle. With Grid, plugins are used to modify the behavior of Grid to add new features. The following features are provided using plugins and custom renderers.

RowExpander

CheckBox Grid

RowNumberer

EditableGrid

EditableGrid is a Grid subtype that provides inline editing support using cell editors. Each editor wraps a Field subclass and provides editors based on the data type being edited. A nice feature of Grid is dirty cell marking. A cell shows a visual indicator when it is dirty as defined by the bound Store and Record. All changes to the Grid can be rejected or committed via the Store with the UI updating automatically.

Next Up

Grid, EditorGrid, and the grid plugins are available in SVN. Next, we will be adding grouping and totaling support to Grid.

This entry was posted on Wednesday, July 23rd, 2008 at 10:38 am and is filed under Ext GWT. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Jules says:

July 24, 2008 at 12:48 am

Very nice. Ext GWT is looking amazing!

nassaja says:

July 24, 2008 at 3:42 am

As I know, now it is impossible to insert combo with divided hidden id and visual value into an editable grid. For this purpose it is necessary to write an artful code.

And work with remote linked combo in an editable grid is a real hell.

Jack, make to us comfortable linked combo with comfortable remote data and predefined values and comfortable binding to an editable grid.

Pavel says:

July 24, 2008 at 9:12 am

Decimal point of num keyboard doesn’t work in editable grid’s price column. It seems to be a bug.

Darren says:

July 25, 2008 at 4:34 am

ExtGWT is looking very good. What’s the timescale for the 1.1 release? Also, how stable is the SVN version?

Daniele says:

September 24, 2008 at 4:58 pm

Hi,thanks for the post but I ask you if in GXT 1.1 the remote filtering on grid is allowed.

Thanks

interpill.org says:

October 19, 2008 at 8:56 am

EditableGrid is a Grid subtype !!

Burun Estetigi says:

November 28, 2008 at 6:35 pm

Mono says:

January 8, 2009 at 9:53 am

I like this example and try to use extjs-gwt in eclipse project. This is my first article about extjs-gwt:gxt
http://extjs-gwt.blogspot.com
See more about Extjs-gwt on Eclipse.
I think this extjs-gwt article can help beginner to learn.