FormPanel如何从后台load json数据的要点

首先我们要说的是数据格式，根据官方的说法，是必须要有success和data这两个属性的，我最开始用的时候因为不知道这一点，搞半天也不能导入数据。
如果你只需要从后台返回页面一个record那么应该是这样： {success:ture, data:{id:1, name:'tom', sex: 1}}
如果你需要从后台返回的是个list那么：{success:ture, xxx:[{id:1, name:'tom', sex: 1}, {id:2, name:'jerry', sex: 0}, {id:3, name:'jack', sex: 1}]}接着说js。
可以利用继承，自己创建一个类型出来，这样容易代码重用，而且代码不用全混在一起也清晰些。

Ext.ns('Ext.william61');
Ext.william61.RoleForm = Ext.extend(Ext.form.FormPanel, {
    initComponent : function(config) { 
        Ext.apply( this, {
            frame:true,
            buttonAlign: 'center',
            height: 419,
            labelWidth: 70,
            bodyStyle:'padding:0 0 0 0',
            reader: new Ext.data.JsonReader({successProperty:'success',totalProperty: 'totalProperty',root: 'xxx'},[
            {name: 'id',mapping:'id',type:'int'},
            {name: 'name',mapping:'name',type:'string'},
            {name: 'sex',mapping:'sex',type:'int'}
       ]), // 这个部分很重要，关系到你时怎么把后台传来的json数据和页面上的数据部分对应的。如果你传回来的是数组，那么用root属性。如果只是一个数据，那么json数据中用data来标识数据那部分就可以了。
       defaultType: 'textfield',
       defaults: {width: 220},
            items: [{
              fieldLabel: 'ID',
              name: 'id'
           },{
              fieldLabel: 'name',
              name: 'name'
           },{
              fieldLabel: 'Sex',
              name: 'sex'
            }],
            buttons: [{
            text: 'load',
            handler: this.onLoad
            },{
                text: 'save'
            },{
                text: 'cancel',
                handler : function() {
                role_win.hide();
                }
            }]
        });
       
        Ext.william61.RoleForm.superclass.initComponent.apply(this, arguments);
       
    },
    onLoad: function(){
    alert('load....')
    }
});

Ext.reg('rform', Ext.william61.RoleForm);

再就是在页面上个什么事件比如一个按钮的双击事件，或者grid的行双击事件触发一个handler
var role_win;
var role_form = new Ext.william61.RoleForm();

handler： function(){
myFormShow();
myFormLoad( 1 ); //根据情况弄一个id来，要利用这个id到后台查询记录
}

var myFormShow = function(){
   if(!role_win){
    role_win = new Ext.Window({
     title:'测试',  
     width: 800 ,  
     height:450,
     resizable: false,
     draggable: false,
     closeAction: 'hide',
     modal:true,
     items: [role_form]        // [{id:'role_form', xtype:'rform'}]
    });    
   }
   role_win.show();
};
var myFormLoad = function(rId){
  role_form.form.load({
    url: 'p2/role_Info.action?roleId='+rId,
    waitMsg: 'xxxxxxxxxxxx...',
    success : function(form,action) {
   
    },
    failure : function(form,action) {
   
    }
   });