ExtJs学习笔记(第一步)

学习了一段时间的ExtJs,谈谈自已的理解.
拿例子来说一下吧:(select 的加载)
Ext.onReady(function(){
    Ext.QuickTips.init();
    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';
   //select准备的数据
    var combo = new Ext.data.JsonStore({
        url:'/a/Site/selectCate.html',
        fields: ['id','name','priority']});
   
     combo.load();      //加载数据
     var form1 = new Ext.FormPanel({
        labelWidth: 150, // label settings here cascade unless overridden
        url:'/a/Site/save.html',
        frame:true,
        title: '网页内容编辑',
        bodyStyle:'padding:5px 5px 0',
        width: 800,
        defaults: {width: 500},
        defaultType: 'textfield',
        waitMsgTarget: true,
        trackResetOnLoad : true,        

    reader: new Ext.data.JsonReader(
{root:'data'},
        [
{name:'sitePage.id',mapping:'id'},
{name:'sitePage.siteTitle',mapping:'siteTitle'},
{name:'sitePage.priority',mapping:'priority'},    
{name:'sitePage.siteContent',mapping:'siteContent'},
{name:'sitePage.siteId',mapping:'siteId'}
        ]),  
        items: [
            new Ext.form.Hidden({   //hidden 
                name:'sitePage.id' 
        }), 
            new Ext.form.ComboBox({
               fieldLabel: '網頁分組',               
                hiddenName:'sitePage.siteId',               
                store:combo,              
                valueField:'id',
                displayField:'name',
                typeAhead: true,
                mode: 'local',
                triggerAction: 'all',            
                selectOnFocus:true,
                editable:false,
                allowBlank:false,
                blankText : "網頁分組是必填項",
                width:20
            }),       
        {
                fieldLabel: '網頁標題',
                name: 'sitePage.siteTitle',
                allowBlank:false,
                blankText : "網頁標題是必填項"
            },{
                xtype:'htmleditor',
                id:'sitePage.siteContent',              
                fieldLabel:'網頁內容',
                allowBlank:false,
                blankText : "網頁內容是必填項"              
            }         
            , {
                fieldLabel: '自定序號',
                name: 'sitePage.priority',
                xtype: "numberfield",
                type: "int",
                width:40
            }
        ],

        buttons: [{
            text: '儲存',
            type:'button',
            id:'save',
            handler: function(){
                //表单验证通过
                if (form1.form.isValid()){   
                    //提交form
                    form1.form.submit({
                    waitMsg:"正在儲存...",
                        success: function(form,action){                         
                           if (action.result.success) {
                              //Ext.MessageBox.hide();
                              Ext.Msg.alert("成功",action.result.data);
                           } else {
                              Ext.Msg.alert("错误","儲存失敗");
                           }
                        },
                        failure: function(){
                           Ext.Msg.alert("错误", "服务器错误，请稍候再试！");
                        }
                    });
                }   
            }           
        },{
            text: '取消',
            type:'reset',
            id:'clear',
            handler: function(){
                 form1.form.reset();
            }
        }
        ]
    });

    form1.render(document.body);   
    form1.getForm().load({url:'/a/Site/load.html?id='+Ext.getDom("sitePage.id").value,waitMsg:'Loading'});
   
});