Hello,

I am using EXT-js for a project, usually everything is pretty straight forward with EXT-js, but with the propertyGrid, I am not sure. I'd like some advice about this piece of code.

First the store to populate the property grid, on the load event:

 var configStore = new Ext.data.JsonStore({
        // store config
        autoLoad:true,
        url: url.remote,
        baseParams : {xaction : 'read'},
        storeId: 'configStore',
        // reader config
        idProperty: 'id_config',
        root: 'config',
        totalProperty: 'totalcount',
        fields: [{
            name: 'id_config'
        }, {
            name: 'email_admin'
        }
        , {
            name: 'default_from_addr'
        }
        , {
            name: 'default_from_name'
        }
        , {
            name: 'default_smtp'
        }
        ],listeners: {
            load: {
                fn: function(store, records, options){
                    // get the property grid component
                    var propGrid = Ext.getCmp('propGrid');
                    // make sure the property grid exists
                    if (propGrid) {
                        // populate the property grid with store data
                        propGrid.setSource(store.getAt(0).data);
                    }
                }
            }
        }

    });

here is the propertyGrid:

 var propsGrid = new Ext.grid.PropertyGrid({
        renderTo: 'prop-grid',
        id: 'propGrid',
        width: 462,
        autoHeight: true,
        propertyNames: {
            tested: 'QA',
            borderWidth: 'Border Width'
        },
        viewConfig : {
            forceFit: true,
            scrollOffset: 2 // the grid will never have scrollbars
        }
    });

So far so good, but with the next button, I'll trigger an old school update, and my question :

Is that the proper way to update this component ? Or is it better to user an editor ? or something else...

for regular grid I use the store methods to do the update, delete,etc...

The examples are really scarce on this one! Even in books about ext-js!

 new Ext.Button({
        renderTo: 'button-container',
        text: 'Update',
        handler: function(){

             var grid = Ext.getCmp("propGrid");  

                     var source = grid.getSource();  

                     var jsonDataStr = null;  

                     jsonDataStr = Ext.encode(source);  

             var requestCg = {  
                             url : url.update,  
                             method : 'post',  
                             params : {  
                                 config : jsonDataStr , xaction : 'update'
                             },  
                             timeout : 120000,  
                             callback : function(options, success, response) {  
                                 alert(success + "\t" + response);  
                }
            };
                Ext.Ajax.request(requestCg);    
        }
    });

and thanks for reading.