表单提交

extjs表单的提交

//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;  
}