ExtJs系列(3)--综合表单

function frmReg()
{
    var objReg=
    {
        id:'reg',
        title:'请先填写注册信息',
        width:300,
        autoHeight:true,
        labelWidth:70,
        labelAlign:'left',
        buttonAlign:'center',
        frame:true,
        defaultType:'textfield',
        defaults:{width:150},
        renderTo:document.body,
        items:
        [
         {fieldLabel:'用户名'},
         {fieldLabel:'密码',inputType:'password'},
         {fieldLabel:'Email'},
         {fieldLabel:'生日',xtype:'datefield'},
         {fieldLabel:'学历',xtype:'combo'},
         //下面选择爱好
         {
           xtype:'panel',
           layout:'column',
           fieldLabel:'请选择',
           items:[{xtype:'checkbox',boxLabel:'篮球'},{xtype:'checkbox',boxLabel:'橄榄球'},{xtype:'checkbox',boxLabel:'足球'},{xtype:'checkbox',boxLabel:'其它'}]
         },
         //下面选择性别
         {
          xtype:'panel',
          layout:'column',
          fieldLabel:'性别',
          items:[{xtype:'radio',boxLabel:'男'},{xtype:'radio',boxLabel:'女'}]
         }
       ],
       buttons:
       [
         {text:'确定'},
         {text:'取消'}
       ]
   }
    var reg=new Ext.form.FormPanel(objReg);
}

function frmReg2()
{
    var objFrm2=
    {
        id:'frm2',
        title:'请填写详细的信息',
        frame:true,
        width:800,
        autoHeight:true,
        renderTo:document.body,
        labelWidth:70,
        labelAlign:'right',
        items:
            [//第一行
                {
                    xtype:'panel',
                    layout:'column',
                    fieldLabel:'用户名',
                    items:
                    [
                        {columnWidth:.5,xtype:'textfield'},
                        {
                            items:
                            [
                                {
                                    xtype:'panel',
                                    columnWidth:.5,
                                    layout:'column',
                                    items:[{xtype:'radio',boxLabel:'男',name:'sex'},{xtype:'radio',boxLabel:'女',name:'sex'}]
                                }
                            ]
                        }
                    ]
                },
               //第二行
               {
                    xtype:'panel',
                    layout:'column',
                    fieldLabel:'选择爱好',
                    items:[{xtype:'checkbox',boxLabel:'蓝求'},{xtype:'checkbox',boxLabel:'足球'}]
               },
               //第三行
               {
                    xtype:'textarea',
                    fieldLabel:'个性',
                    height:50,
                    anchor:"95%"
               },
               {//上面是第4行
                    xtype:"htmleditor",
                   fieldLabel:"想说的话",
                   name:"WantToSay",
                   anchor:"95%",
                   enableAlignments:false,//去除左右对齐工具栏
                   enableLists:false//去除列表工具栏
                 },
                 {
                    xtype:"fieldset",
                    checkboxToggle:true,//关键参数，其他和以前的一样
                    checkboxName:"dfdf",
                    title:"选填信息",
                    defaultType:'textfield',
                    width:330,
                    autoHeight:true,//使自适应展开排版
                    items:[{
                        fieldLabel:"UserName",
                        name:"user",
                        anchor:"95%"//330px-labelWidth剩下的宽度的95%，留下5%作为后面提到的验证错误提示
                      },
                      {
                        fieldLabel:"PassWord",
                        inputType:"password",//密码文本
                        name:"pass",
                        anchor:"95%"
                      }]
}

            ]
       
    };
    var reg2=new Ext.form.FormPanel(objFrm2);
}

 Ext.onReady(function(){
 frmReg();
 frmReg2();
 })