Drat of the simplified version of the xgrid.

static/plugin_dbui/src/appgrid.js

 /**
- * The Grid class is a configured version of the GridPanel
+ * The Grid class is Ext.grid.GridPanel with a Ext.PagingToolbar
  * Many functionality can be added through grid plugins like
- * App.grid.RowEditorContextMenu, ....
+ * App.grid.RowEditor, ....
  * 
  * The type of this component is xgrid.
  * 
@@ -15,96 +15,104 @@ Ext.namespace('App.grid');
 App.grid.Grid = Ext.extend(Ext.grid.GridPanel, {
 
     /**
-     * @cfg {Object} model Object to configure the widget 
-     * for a table of the database. It is provided by the server 
-     * and contains the following keys:
-     * 
-     *      colModel: [...], 
-     *      formModel: [...], 
-     *      store: {}, 
-     *      table: 'x', 
-     *      title: 'y', 
-     *      xtype: 'xgrid'
-     * } 
+     * private attributes used by plugins
      */
-    model: null,
-    
-    /**
-     * pre-defined properties
-     */
-    iconCls: 'silk-grid',
-    frame: false,
-    viewConfig: {forceFit: true},
-
-    /**
-     * private 
-     * keep track of RowEditor set by the plugins like 
-     * RowEditorToolBar, RowEditorContextMenu.
-     */
-    editor: null,
-
-    /**
-     * private method requests by the component model of ExtJS
-     */
-    initComponent: function () {
-
-        if (!this.model) {
-            throw new Error("the property model is missing !!!");
-        }
-
-        // grid title
-        this.title = this.model.title;
-        
-        // the data store		
-        this.store = new App.data.JsonStore({
-            url: App.dburl,
-            model: this.model.store,
-            debug: App.debug
-        });
-        
-        // the columns model
-        this.columns = this.model.colModel;
-
-        // empty top toolBar/bottomBar
-        this.tbar = [];
-        
-        // empty Paging toolBar requires by the plugins
-        this.bbar = new Ext.PagingToolbar();
-        this.bbar.hide();
-        
-        // initialize the underlying class. DON'T MOVE
-        App.grid.Grid.superclass.initComponent.call(this);
-        
-        this.on('beforerender', this.onBeforeRender);
-    },
-    
-    /**
-     * Handler call before render. It is used to load the store
-     * 
-     * NOTE: 
-     * The way to load the store depends on the presence of the paging plugin.
-     * In this library the initialization sequence start with the initComponent
-     * followed by the initialization of the plugins followed by the render.
-     * 
-     * @param {Object} grid
-     */
-    onBeforeRender: function (grid) {
-        
-        // is the paging plugin in the plugins list ?
-        var isPagingPlugin = App.isPlugin(grid, 'pGridPaging');
-                
-        // load the store
-        // NOTE: when the paging is in action, need to recuperate the
-        // number of records. It is why we only ask the first one.
-        // When the store will be loaded, the paging plugin will tune
-        // the number of rows per page and will reload the store accordingly.
-        if (isPagingPlugin) {
-            grid.store.load({params: {start: 0, limit: 1}});
-        } else {
-            grid.store.load();
-        }
-        return true;
-    }
+    rowEditor: null    
 });
 
 Ext.reg('xgrid', App.grid.Grid);
+
+//App.grid.Grid = Ext.extend(Ext.grid.GridPanel, {
+//
+//    /**
+//     * @cfg {Object} model Object to configure the widget 
+//     * for a table of the database. It is provided by the server 
+//     * and contains the following keys:
+//     * 
+//     *      colModel: [...], 
+//     *      formModel: [...], 
+//     *      store: {}, 
+//     *      table: 'x', 
+//     *      title: 'y', 
+//     *      xtype: 'xgrid'
+//     * } 
+//     */
+//    model: null,
+//    
+//    /**
+//     * pre-defined properties
+//     */
+//    iconCls: 'silk-grid',
+//    frame: false,
+//    viewConfig: {forceFit: true},
+//
+//    /**
+//     * private 
+//     * keep track of RowEditor set by the plugins like 
+//     * RowEditorToolBar, RowEditorContextMenu.
+//     */
+//    editor: null,
+//
+//    /**
+//     * private method requests by the component model of ExtJS
+//     */
+//    initComponent: function () {
+//
+//        if (!this.model) {
+//            throw new Error("the property model is missing !!!");
+//        }
+//
+//        // grid title
+//        this.title = this.model.title;
+//        
+//        // the data store		
+//        this.store = new App.data.JsonStore({
+//            url: App.dburl,
+//            model: this.model.store,
+//            debug: App.debug
+//        });
+//        
+//        // the columns model
+//        this.columns = this.model.colModel;
+//
+//        // empty top toolBar/bottomBar
+//        this.tbar = [];
+//        
+//        // empty Paging toolBar requires by the plugins
+//        this.bbar = new Ext.PagingToolbar();
+//        this.bbar.hide();
+//        
+//        // initialize the underlying class. DON'T MOVE
+//        App.grid.Grid.superclass.initComponent.call(this);
+//        
+//        this.on('beforerender', this.onBeforeRender);
+//    },
+//    
+//    /**
+//     * Handler call before render. It is used to load the store
+//     * 
+//     * NOTE: 
+//     * The way to load the store depends on the presence of the paging plugin.
+//     * In this library the initialization sequence start with the initComponent
+//     * followed by the initialization of the plugins followed by the render.
+//     * 
+//     * @param {Object} grid
+//     */
+//    onBeforeRender: function (grid) {
+//        
+//        // is the paging plugin in the plugins list ?
+//        var isPagingPlugin = App.isPlugin(grid, 'pGridPaging');
+//                
+//        // load the store
+//        // NOTE: when the paging is in action, need to recuperate the
+//        // number of records. It is why we only ask the first one.
+//        // When the store will be loaded, the paging plugin will tune
+//        // the number of rows per page and will reload the store accordingly.
+//        if (isPagingPlugin) {
+//            grid.store.load({params: {start: 0, limit: 1}});
+//        } else {
+//            grid.store.load();
+//        }
+//        return true;
+//    }
+//});