EXT表单-CSDN博客

ETX系列：

纯表单

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:false,  
                 items: [{  
         }]  
     });  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

注意：frame:false,和frame:true的差异

基本表单

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:true,  
                items: [{  
             xtype: 'textfield',  
             fieldLabel: '名称',  
             name: 'title'  
         },{  
             xtype: 'textfield',  
             fieldLabel: '内容',  
             name: 'director'  
         }],  
             buttons:[{  
             text:'开始查询',  
             handler:function(){  
                 doSearch();  
             }  
         }]  
   
     });  
   
 var doSearch=function()  
 {  
 Ext.Msg.alert('提示','操作已经成功');  
 }  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

表单跳转：

var doSearch=function() { //Ext.Msg.alert('提示','操作已经成功'); location.href ='d.php'; }

表单元素设置ID以及获取

设置id

items: [{ xtype: 'textfield', fieldLabel: '名称', name: 'title', id:'tt' },

获取id:

Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").id);

完整代码

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
      
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:true,  
                items: [{  
             xtype: 'textfield',  
             fieldLabel: '名称',  
             name: 'title',  
                         id:'tt'  
         },  
                 {  
             xtype: 'textfield',  
             fieldLabel: '内容',  
             name: 'director'  
         }],  
             buttons:[{  
             text:'开始查询',  
             handler:function(){  
                 doSearch();  
             }  
         }]  
   
     });  
   
 var doSearch=function()  
 {  
 Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").id);  
 }  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

如果不设置id系统会默认给其id

注释// id:'tt'

比较就明白了

获取文本框内容

Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").value);

或者

Ext.get('title').getValue()

声明示定义文本框以及获取值

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
     var txtAccount = new Ext.form.TextField({  
         width:120,fieldLabel:'用户名'  
     });  
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:true,  
                items: [{  
             xtype: 'textfield',  
             fieldLabel: '名称',  
             name: 'title'  
                           
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [txtAccount]  
         },  
                 {  
             xtype: 'textfield',  
             fieldLabel: '内容',  
             name: 'director'  
         }],  
             buttons:[{  
             text:'开始查询',  
             handler:function(){  
                 doSearch();  
             }  
         }]  
   
     });  
   
 var doSearch=function()  
 {  
 //Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").id);  
 Ext.Msg.alert('提示','操作已经成功'+txtAccount.getValue());  
 }  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

定义单选框以及获取选中

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
         var txtAccount = new Ext.form.TextField({  
         width:120,fieldLabel:'用户名'  
     });  
        var checkFlag = new Ext.form.Checkbox({boxLabel:'是',fieldLabel:'是否选择',value:1});  
          
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:true,  
                items: [{  
             xtype: 'textfield',  
             fieldLabel: '名称',  
             name: 'title'  
                           
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [txtAccount]  
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [checkFlag]  
         },  
                 {  
             xtype: 'textfield',  
             fieldLabel: '内容',  
             name: 'director'  
         }],  
             buttons:[{  
             text:'开始查询',  
             handler:function(){  
                 doSearch();  
             }  
         }]  
   
     });  
   
 var doSearch=function()  
 {  
 //Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").id);  
 //Ext.Msg.alert('提示','操作已经成功'+txtAccount.getValue());  
 var rejectFlag =0;  
 if(checkFlag.checked==true)  
 {  
 rejectFlag=1;  
 }  
 Ext.Msg.alert('提示','操作已经成功'+rejectFlag);  
 }  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

下拉框绑定以及获取选中值

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
 Ext.onReady(function(){  
         var txtAccount = new Ext.form.TextField({  
         width:120,fieldLabel:'用户名'  
     });  
        var checkFlag = new Ext.form.Checkbox({boxLabel:'是',fieldLabel:'是否选择',value:1});  
   
        var DeptDs = new Ext.data.Store({  
             proxy: new Ext.data.HttpProxy({  
                 method:'post',  
                 url: 'd.php',  
                 params:{test:'load'}  
             }),   
             autoLoad:true,  
             reader:new Ext.data.JsonReader({  
                 root : 'data',id:'dddd',  
                 totalProperty : 'totalCount'  
             }, [{name : 'value'},{name : 'text'}])  
     });  
        var comboDepts = new Ext.form.ComboBox({  
         store:DeptDs,  
         valueField :"value",  
         displayField: "text",id:'value',  
         mode: 'local',allowBlank:true,  
         emptyText:'选择省份.....',width:220,fieldLabel: '省份',  
         blankText:'选择省份',  
         editable: true,anyMatch:true,tabIndex:4,  
         triggerAction: 'all'  
     });  
     var form1 = new Ext.form.FormPanel({  
         title:'综合查询',  
         applyTo:'search_form',  
         frame:true,  
                items: [{  
             xtype: 'textfield',  
             fieldLabel: '名称',  
             name: 'title'  
                           
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [txtAccount]  
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [checkFlag]  
         },  
                 {columnWidth:.5,layout: 'form',  
         items: [comboDepts]  
         },  
                 {  
             xtype: 'textfield',  
             fieldLabel: '内容',  
             name: 'director'  
         }],  
             buttons:[{  
             text:'开始查询',  
             handler:function(){  
                 doSearch();  
             }  
         }]  
   
     });  
   
 var doSearch=function()  
 {  
 //Ext.Msg.alert('提示','操作已经成功'+Ext.getDom("title").id);  
 //  
 //Ext.Msg.alert('提示','操作已经成功'+txtAccount.getValue());  
   
 //Ext.Msg.alert('提示','操作已经成功'+Ext.get('title').getValue());  
 Ext.Msg.alert('提示','操作已经成功'+comboDepts.getValue());  
   
 }  
   
 });  
   
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
 <div id='search_form'></div>  
 </body>  
 </html>  

d.php返回的数据

{"success":true,"data":[
{"value":"010","text":"北京"},
{"value":"021","text":"上海"}
]}

ajax提交表单数据

[html]view plaincopy 
   
 <html>  
 <head><title>演示</title>  
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">  
 <link rel="stylesheet" type="text/css" media="all" href="extjs/resources/css/ext-all.css" />  
 <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>  
 <script type="text/javascript" src="extjs/ext-all.js"></script>  
  <script src="extjs/build/locale/ext-lang-zh_CN.js"></script>  
   
 <script type="text/javascript">  
   
 Ext.onReady(function(){  
   
           Ext.QuickTips.init();  
           Ext.form.Field.prototype.msgTarget = 'side';  
   
   
           var simple = new Ext.FormPanel({  
                 labelWidth: 75,  
                 baseCls: 'x-plain',  
                 defaults: {width: 150},  
                 defaultType: 'textfield',  
   
   
                 items: [{  
                         fieldLabel: '帐户',  
                         name: 'name',  
                         allowBlank:false,  
                         blankText:'帐户不能为空'  
                     },{  
                         inputType:'password',  
                         fieldLabel: '密码',  
                         name: 'pwd',  
                         allowBlank:false,  
                         blankText:'密码不能为空'  
                     }  
                 ],  
   
                 buttons: [{  
                     text: '登录系统',  
                     type: 'submit',  
   
                     handler:function(){  
                               if(simple.form.isValid()){  
   
   
                                  //ExtJs Ajax表单提交  
                                  simple.form.doAction('submit',{  
                                      url:'d1.php',  
                                      method:'post',  
                                      params:'',  
   
                                      success:function(result,request){  
                                             //alert(action.result.msg);  
                                                 Ext.Msg.alert('操作成功',request.result.data);//json是什么这里就是什么  
                                      },  
   
                                      failure:function(){  
                                             Ext.Msg.alert('警告', '未知的失败原因！');  
   
                                      }  
                                   });  
                                }  
                     }  
                 }]  
             });  
   
                    win = new Ext.Window({  
                         id:'win',  
                         title:'用户登陆',  
                         layout:'fit',  
                         width:300,  
                         height:150,  
                         plain:true,  
                         bodyStyle:'padding:5px;',  
                         maximizable:false,  
                         closeAction:'close',  
                         closable:false,  
                         collapsible:true,  
                         plain: true,  
                         buttonAlign:'center',  
                         items:simple  
                     });  
                     win.show();  
   
          });  
 </script>  
 </head>  
    
 </head>  
 <body>  
 <div id="hello"></div>  
   
 </body>  
 </html>  

验证的d.php页面

[php]view plaincopy 
   
 <?php  
 $arr = array(  
 'success' => 'true',  
 'data' => '1001111111111111111111111'  
 );  
 $json_string = json_encode($arr);  
 echo $json_string;  
 ?>  

说明：

必须返回json的格式切要有success,类似这样的：

("{success:true,info:'1001111111111111111111111!'}");

=========================================

//ExtJs 表单提交
form.getForm().submit({
    success:function(){
    },
    failure:function(){
    }
});
//ExtJs Ajax表单提交
form.form.doAction('submit', {
    url : 'user.do?method=login',
    method : 'post',
    // 如果有表单以外的其它参数，可以加在这里。我这里暂时为空，也可以将下面这句省略
    params : '',
    // 第一个参数是传入该表单，第二个是Ext.form.Action对象用来取得服务器端传过来的json数据
    success : function(form, action) {
        Ext.Msg.alert('操作', action.result.data);   //result为json对象
        this.disabled = false;
    },
    failure : function(form, action) {
        Ext.Msg.alert('警告', '用户名或密码错误！');
        // 登录失败，将提交按钮重新设为可操作
        this.disabled = false;
    }
});


//ExtJs Ajax普通提交
Ext.Ajax.request({
     url: 'login.do',    //请求地址
     //提交参数组
     params: {
         form.getForm().getValues()   //取出表单所有值
     },
     //成功时回调
     success: function(response, options) {
        //获取响应的json字符串
       var responseArray = Ext.util.JSON.decode(response.responseText);
        if(responseArray.success==true){
            Ext.Msg.alert('恭喜','您已成功登录！');
        } else{
            Ext.Msg.alert('失败','登录失败，请重新登录');
        }
    }
});

//老grid
var myData = ${jobs}; //二维数组
var store = new Ext.data.ArrayStore({
    fields: [
       {name: 'group'},
       {name: 'name'},
       {name: 'description'},
       {name: 'jobClass'},
       {name: 'namegroup'}
    ]
});
store.loadData(myData);
var grid = new Ext.grid.GridPanel({
    title:"<fmt:message key='title.listAllJobs'/>",
    store: store,
    width:all_width,
    autoHeight : true,
    autoExpandColumn : 'namegroup',
    viewConfig : {
       forceFit : true
    },
    stripeRows: true,
    columns: [
        {header: "<fmt:message key='label.job.group'/>", width: 140, sortable: true, dataIndex: 'group'},
        {header: "<fmt:message key='label.job.name'/>", width: 140, sortable: true, dataIndex: 'name'},
        {header: "<fmt:message key='label.job.description'/>", width: 180, sortable: true, dataIndex: 'description'},
        {header: "<fmt:message key='label.job.jobClass'/>", width: 200, sortable: true, dataIndex: 'jobClass'},
        {id : 'namegroup',header: "<fmt:message key='label.global.actions'/>", dataIndex: 'namegroup', renderer: change}
    ],
    bbar: new Ext.PagingToolbar({ afterPageText: '/ {0}',beforePageText: '页',firstText: '第一页'
        ,prevText: '前一页',nextText: '后一页',lastText: '最后一页',refreshText: '刷新',store: store
        , pageSize: 20,displayInfo: true, displayMsg: '显示 {0} - {1} 条记录，共 {2} 条', emptyMsg: "没有数据"})
});

//如果store设置了url属性，可重新指定url的参数:
store.load({params:{a:1, b:2}});

//如果store的内容只是普通的数组：
store.loadData([...]);

//如果store没有单独的变量定义，可以用
comboBox.initialConfig.store
//或
Ext.getCmp('comboId').initialConfig.store

//窗口
var win;

win = new Ext.Window({//添加/修改菜单弹出窗口
    id:'winId',
    title:'',
    width: '',
    height:'',
    layout: 'fit',
    modal:true,
    closeAction:'hide',
    buttonAlign:'center',
    resizable:false,
    items: [grid],
    listeners:{
        'hide':function(){}
    }
});
Ext.getCmp('winId').show();

listeners:{
    render:function(){},
    click:function(a,e){}
}

//按钮
var button = new Ext.Button({
    text:'查询',
    listeners:{click:function(a,e){
    }}
})

//表单
var form = new Ext.FormPanel({
    id:'form',
    width: '',
    height:42,
    labelWidth: '',             //标签宽度
    layout:'column',            //分列
    style:'padding:4 4 2 4',
    defaults:{layout:'form'},   //子项默认使用form样式
    colspan:2,
    frame:true,
    submit: function(){
       this.getEl().dom.action = '${pageContext.request.contextPath}/layout.table?method=addData'; //连接到服务器的url地址
       this.getEl().dom.method = 'post';
       this.getEl().dom.submit();
    },
    items:[
    {
        columnWidth:.17,
        items: [{
            xtype:'label',
            text:'',
            emptyText:'',
            allowBlank:false,
            blankText:'',
            regex:/^[A-Za-z0-9]+$/,
            regexText:'',
            maxLength:20,
            maxLengthText:''
        }]
    },{
        columnWidth:.04,
        items: [button]
    }]
});
//form.getForm().isValid()

//表格
var table = new Ext.Panel({
    renderTo:'content',
    layout:'table',
    width:'',
    border:false,
    layoutConfig: {columns:2},      //划分两列
    bodyStyle:'background:#dfe8f6;border: 1px solid #dfe8f6',
    defaults: {frame:true},         //填充文本背景颜色
    items:[form,chart,grid]
})

//标签页
var tabs = new Ext.TabPanel({
    resizeTabs:true, // tab宽度自动调整
    minTabWidth: 115,   //tab最小宽度值
    tabWidth:135,       //tab初始宽度
    enableTabScroll:true,//tab超出范围出现横向滚动条
    frame:true,
    activeTab:0,
    defaults: {bodyStyle:'background:#dfe8f6;border: 1px solid #dfe8f6'},
    items:[{
        id:'tab1_1',
        title:'',
        items:[chart1] //添加table
    },{
        id:'tab1_2',
        title:'',
        items:[chart1]
    }]
});

var tools = [{
    id:'gear',
    qtip :'为表单分配权限',
    handler: function(e, target, panel){
        //获得grid中所选的表单编号（即id值）
        sRows = grid.getSelections('id_');
        if(sRows==null)
        {
            Ext.Msg.show({
                        title:'提示',
                        msg: '<b>请选择表单后再分配权限!</b>',
                        buttons: {ok:'确定'},
                        icon: Ext.MessageBox.INFO,
                        maxWidth :300,
                        minWidth :300,
                        closable:false,
                        defaultTextHeight :100
                        });
            return;
        }
    }
}]

//框架面板
var border = new Ext.Panel({
    layout:'border',
    renderTo:'content',
    width:'',
    height:'',
    items:[{
        region:'north',
        xtype:'panel',
        margins: '4 4 2 4',
        height:42,
        bodyStyle:'background:#dfe8f6;border: 1px solid #dfe8f6',
        items:[form]
    },{
        region:'west',
        id:'west-panel',
        width: '',
        style:'padding:2 2 4 4',
        collapsible: true,
        defaults:{border:false},
        layoutConfig:{
            animate:true
        },
        items: [tree]
    },{
        region:'center',
        style:'padding:2 4 4 2',
        border:false,
        items:[tabs]
    }]
});

//日期控件
var dateSign_start = new Ext.form.DateField({
    value:startTime,
    format:"Y-m",
    fieldLabel:'开始时间',
    listeners:{
        change:function(){
        }
    }
});

//下拉列表
//静态
var fields=["name","valtext"];
var data_branchCompany=[['01','1月'],['02','2月']];
var store_branchCompany = new Ext.data.SimpleStore({
    fields:fields,
    data:data_month
});
//动态
var dsUrl_branchCompany ="${pageContext.request.contextPath}/adapter2Table.table?key=branchCompany&dropdownlist=true";
var store_branchCompany = new Ext.data.Store({
    url:dsUrl_branchCompany,
    autoLoad: true,
    reader: new Ext.data.JsonReader({},[
     //设置如何解析
    {name:'name'},
    {name:'valtext'}
    ])
    ,listeners:{
        "load":function()
        {
        }
    }
});
var comboBox_branchCompany = new Ext.form.ComboBox({
    id:'comboBox_branchCompanyId',
    width: 75,
    selectOnFocus : true,
    allowBlank:false,
    readOnly:true,
    emptyText: '',
    fieldLabel:'',
    store:store_branchCompany,
    triggerAction: "all", //不加该语句选中某项后
    mode: "local",   //动态需要
    displayField: "name",
    valueField: "valtext",
    listeners: {
        "select": function (combo,record,index){
            //record.get("name");
         }
    }
});

//隐藏div
type.on("select",function(combo,record,index){
    if(record.get('valtext') == 0){
    }
});


//树
var tree = new Ext.tree.TreePanel({
    id:'tree',
    border: false,
    containerScroll: true,
    enableDD:false,//设置是否允许拖拽
    useArrows: false,//是否使用箭头记号,默认为false
    rootVisible :true,//设置是否显示根节点
    autoScroll:true,
    loader: new Ext.tree.TreeLoader({
        dataUrl: '${pageContext.request.contextPath}/treeQuery.tree?method=queryNode&key=product_order',
        listeners:{beforeload:function(treeLoader, node) {
                    this.baseParams.id = node.id;
        }}
    }),
    root: {
        nodeType: 'async',
        text: '付费节目',
        draggable: false,
        id: '1'
    },
    listeners:{
        click:function(node,ev){
            id=node.id;
        }
    }
});
tree.getRootNode().expand();

tree_org.on("append",function(tree,parentNode,node,index)
{
    for(var i=0,len=roles.length;i<len;i++)
    {
        if(roles[i].编号 == node.id)
        {
            node.attributes.checked=true;
            break;
        }
    }
});

//滑动菜单
{
    region:'west',
    id:'west-panel',
    title:'West',
    width: 200,
    style:'padding:4 2 4 4',
    collapsible: true,
    layout:'accordion',
    defaults:{border:false},
    layoutConfig:{
        animate:true
    },
    items: [{
        title:'菜单1',
        items:[tree]
    },{
        title:'菜单2',
        contentEl:'hw'
    }]
}

//表单中控件
{
    fieldLabel: '性别',
    xtype:'radiogroup',
    items:[{
            boxLabel:'男',
            name: 'SEX_',
            value:"${SEX_}",
            checked:true,
            inputValue: 1
        },{
            boxLabel:'女',
            name: 'SEX_',
            inputValue: 2
        }]
},{
    fieldLabel: 'SHOURU',
    xtype:'checkboxgroup',
    items:[{
            boxLabel:'SHOURU1',
            name: 'SHOURU',
            checked:true,
            inputValue: 1
        },{
            boxLabel:'SHOURU2',
            name: 'SHOURU',
            inputValue: 2
        },{
            boxLabel:'SHOURU3',
            name: 'SHOURU',
            inputValue: 3
        }]
},{
    xtype:'field',
    inputType:'file',
    name:'SHUISHOU',
    fieldLabel:'上传'
},{
    xtype:'textfield',
    name:"",
    hidden:true,
    hideMode:"display",
    hideLabel:true,
    value:""
},{
    frame:false,border:false,baseCls:'x-plain',items:[{
    xtype:'htmleditor',
    id:'id_htmleditor',
    width:500,
    height:350,
    name:'rulecontent_',
    fieldLabel:'规则信息'
}]}

//Ext dom操作
Ext.getDom('')//返回Js对象
Ext.getCmp('').getValue();
Ext.getCmp("org-tree-panel").getChecked("id");//获得树节点
Ext.getCmp('form').form.findField("name").setValue('1',true);
Ext.getCmp('form').form.findField('name').getValue().inputValue;//radio选中值
grid.getSelections('列名');//获得选中
//checkbox选中值
var checkbox = Ext.getCmp('form').form.findField('name');
if(checkbox.items.get(i).checked){
    checkbox.items.get(i).inputValue;
}