Extjs Formpanel code 例子
/* * Ext JS Library 2.0.2 * Copyright(c) 2006-2008, Ext JS, LLC. * licensing@extjs.com ** http://extjs.com/license */ Ext.namespace("Tenpay");Tenpay.Form = Ext.extend(Ext.form.FormPanel,{frame:true,url:'dispatch',plain:true,labelWidth:120,labelAlign:"center",initComponent:function(){ Ext.apply(this, {bodyStyle:"padding:5px 5px 0",monitorValid:true,defaults:{xtype:'textfield',width:200},items:[{ fieldLabel:"编号",name:"fcbm_index", ctCls: "data_tab_tdr2",allowBlank:false},{fieldLabel:"服务器绑定IP",name:"fcbm_ip", ctCls: "data_tab_tdr2",allowBlank:false},{fieldLabel:"主侦听端口",name:"fcbm_port",allowBlank:false},{fieldLabel:"服务器标示",name: "fcbm_svr",allowBlank:false},{fieldLabel:"开放端口列表",name:"fcbm_port_list_idx",allowBlank:false},{fieldLabel:"承载的应用",name:"fcbm_port_app",allowBlank:false},{xtype:"combo",fieldLabel:"信息状态",mode :"local",displayField :'state',valueField:'abbr',readOnly:true,triggerAction : "all",emptyText:"请选择，不能为空",hiddenName:"fcbm_rec_status",store:new Ext.data.SimpleStore({fields:['abbr','state'],data:[['1','可用'] , ['0','不可用']]})},{fieldLabel:"停止状态应答包",name:"fcbm_stop_resp",allowBlank:false,anchor:"80%"},{xtype:"hidden",name:"objectId",hidden:true,hiddenLabel:true//value:"object_id"}],buttons: [{ text :"确定", handler:this.submit, scope:this, formBind:true},{ text :"取消", scope:this, handler: this.reset}]}); Tenpay.Form.superclass.initComponent.apply(this, arguments); } ,onRender:function() { // call parent Tenpay.Form.superclass.onRender.apply(this, arguments); // set wait message targetthis.getForm().waitMsgTarget = this.getEl(); }, // eo function onRenderonLoadClick:function() { this.load({ url:this.url ,waitMsg:'Loading...' ,params:{cmd:'load'} });// any additional load click processing here } , // eo function onLoadClicksubmit:function() {if(this.getForm().isDirty()){this.getForm().submit({url:this.url,scope:this,success:this.onSuccess,failure:this.onFailure,params:{cmd:'save'},waitMsg:'正在保存，请稍候....'});}},// eo function submitonSuccess:function(form, action) { Ext.Msg.show({ title:'修改成功' ,msg:'修改成功！' ,modal:true ,scope:this ,fn:this.onFlush ,icon:Ext.Msg.INFO,buttons:Ext.Msg.OK });} ,// eo function onSuccess onFlush:function(form,action){ document.location.href="fcbm.do?method=show"; //Ext.Ajax.request({url:"fcbm.do" , method:"POST" ,params:{method:"show"}}) ;// this.getForm().submit({// url:'fcbm'// ,scope:this// ,params:{method:'show'}// ,waitMsg:'ҳ����ת�У����Ժ�...'// }); }, onFailure:function(form, action) { this.showError(action.response.responseText);}, // eo function onFailureshowError:function(msg, title) {title = title || 'Error';Ext.Msg.show({title:title,msg:msg,modal:true,icon:Ext.Msg.ERROR,buttons:Ext.Msg.OK});}, // eo function showErrorreset:function(){this.ownerCt.close();} }); //end extends // register xtypeExt.reg('fcForm', Tenpay.Form);Ext.onReady(function(){Ext.BLANK_IMAGE_URL = './ext/resources/images/default/s.gif'; Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; Ext.lib.Ajax.defaultPostHeader += '; charset=utf-8';var isload = true; var bts; var tt; var jsData = Ext.get('datas'); if(jsData.dom.value=='' || jsData.dom.value=="") { isload = false; } if(isload) {bts = Ext.DomQuery.select("span input");tt = Ext.util.JSON.decode(jsData.dom.value);Ext.each(bts,function(obj){var btn = Ext.get(obj['id']);btn.on("click",function(){var win = new Ext.Window({ layout:'fit', plain:true, width:500, height:320, title: '编辑负载均衡器信息', draggable: true, // �����Ϸ� closable: true, // ���Թر� //closeAction:"hide", buttonAlign:'center', modal: true,// Ϊģʽ�Ի��� items:{ id:'fcformload', xtype:'fcForm' },listeners:{"show":function() { var form = Ext.getCmp('fcformload').getForm(); form.setValues(tt); }}}); win.show(btn);},this);}); //点击查看链结触发事件 var as = Ext.DomQuery.select("span a"); Ext.each(as,function(obj){ var a = Ext.get(obj['id']); var dp = Ext.get('d'+a.id); a.on("click",function(){ var win =new Ext.Window({ layout:'fit', title:'查看负载均衡器信息', plain:true, width:650, autoHeight:true, html:dp.dom.innerHTML, buttons:[{ text:"关闭", handler:function(){ win.hide(); }, scope:this }] }); win.show(a); }); },this); }//�������Tenpay.Adform = Ext.extend(Ext.form.FormPanel,{frame:true,url:'dispatch',plain:true,labelWidth:120,labelAlign:"center",initComponent:function(){ Ext.apply(this, {bodyStyle:"padding:5px 5px 0",monitorValid:true,defaults:{xtype:'textfield',width:200},items:[{ fieldLabel:"编号",name:"fcbm_index",allowBlank:false,blankText:"����Ϊ�գ�����ȷ��д"},{fieldLabel:"服务器绑定IP",name:"fcbm_ip",allowBlank:false,blankText:"该字段不能为空"},{fieldLabel:"主侦听端口",name:"fcbm_port",allowBlank:false,blankText:"该字段不能为空"},{fieldLabel:"服务器标示",name: "fcbm_svr",allowBlank:false,blankText:"该字段不能为空"},{fieldLabel:"开放端口列表",name:"fcbm_port_list_idx",allowBlank:false},{fieldLabel:"承载的应用",name:"fcbm_port_app",allowBlank:false,blankText:"该字段不能为空"},{xtype:"combo",fieldLabel:"信息状态",mode :"local",displayField :'state',valueField:'abbr',readOnly:true,triggerAction : "all",emptyText:"请选择",hiddenName:"fcbm_rec_status",allowBlank:false,blankText:"该字段不能为空",store:new Ext.data.SimpleStore({fields:['abbr','state'],data:[['1','可用'] , ['0','不可用']]})},{fieldLabel:"停止状态应答包",name:"fcbm_stop_resp",allowBlank:false,anchor:"80%",blankText:"该字段不能为空"},{xtype:"hidden",name:"objectId",hidden:true,hiddenLabel:true//value:"object_id"}],buttons: [{ text :"提交", handler:this.submit, scope:this, formBind:true},{ text :"取消", scope:this, handler: this.reset}]}); Tenpay.Form.superclass.initComponent.apply(this, arguments); } ,onRender:function() { // call parent Tenpay.Form.superclass.onRender.apply(this, arguments); // set wait message targetthis.getForm().waitMsgTarget = this.getEl(); }, // eo function onRendersubmit:function() {if(this.getForm().isDirty()){this.getForm().submit({url:this.url,scope:this,success:this.onSuccess,failure:this.onFailure,params:{cmd:'add'},waitMsg:'正在保存。。。'});}},// eo function submitonSuccess:function(form, action) { Ext.Msg.show({ title:'添加成功' ,msg:'新增成功' ,modal:true ,scope:this ,fn:this.onFlush ,icon:Ext.Msg.INFO,buttons:Ext.Msg.OK });} ,// eo function onSuccess onFlush:function(form,action){ document.location.href="fcbm.do?method=show"; }, onFailure:function(form, action) { this.showError(action.response.responseText);}, // eo function onFailureshowError:function(msg, title) {title = title || 'Error';Ext.Msg.show({title:title,msg:msg,modal:true,icon:Ext.Msg.ERROR,buttons:Ext.Msg.OK});}, // eo function showErrorreset:function(){this.ownerCt.close();}});Ext.reg('Adform', Tenpay.Adform);var adbtn = Ext.get("adBtn");adbtn.on("click", function(){var w = new Ext.Window({ layout:'fit' ,plain:true ,width:500 ,height:300 ,title:'新增负载均衡器信息' ,draggable:true ,closeable:true ,buttonAlign:'center' ,model:true ,items:{ id:'adform' ,xtype:'Adform' } });w.show(); });});----------------------------------------------------------------------------------------------------------------/* * Ext JS Library 2.0.2 * Copyright(c) 2006-2008, Ext JS, LLC. * licensing@extjs.com ** http://extjs.com/license */ Ext.namespace("Tenpay"); Tenpay.Form = Ext.extend(Ext.form.FormPanel,{ frame:true, url:'dispatch', plain:true, labelWidth:120, labelAlign:"center", initComponent:function(){ Ext.apply(this, { bodyStyle:"padding:5px 5px 0", monitorValid:true, defaults:{xtype:'textfield',width:200}, items:[{ fieldLabel:"编号", name:"fcbm_index", allowBlank:false },{ fieldLabel:"负载均衡器状态", name:"fcbm_real_status", allowBlank:false },{ fieldLabel:"自动切换时间(秒)", name:"fcbm_auto_time", allowBlank:false },{ fieldLabel:"最大空闲连接数", name: "fcbm_max_spare", allowBlank:false },{ fieldLabel:"最大连接数", name:"fcbm_max_conn", allowBlank:false },{ xtype:"datefield", fieldLabel:"配置信息刷新时间", name:"fcbm_flush_time", altFormats: 'Y-m-d H:i:s', format: 'Y-m-d H:i:s', allowBlank:false },{ fieldLabel:"连接服务器列表", name:"fcbm_svr_list", allowBlank:false },{ fieldLabel:"允许访问客户端列表IP列表", name:"fcbm_cli_list", allowBlank:false },{ fieldLabel:"允许访问的交易类型列表", name:"fcbm_tran_list", allowBlank:false },{ fieldLabel:"停止状态应答包", name:"fcbm_stop_resp", allowBlank:false, anchor:"80%" },{ xtype:"hidden", name:"objectId", hidden:true, hiddenLabel:true //value:"object_id" }], buttons: [{ text :"确定", handler:this.submit, scope:this, formBind:true }, { text :"取消", scope:this, handler: this.reset }] }); Tenpay.Form.superclass.initComponent.apply(this, arguments); } ,onRender:function() { // call parent Tenpay.Form.superclass.onRender.apply(this, arguments); // set wait message target this.getForm().waitMsgTarget = this.getEl(); }, // eo function onRender onLoadClick:function() { this.load({ url:this.url ,waitMsg:'Loading...' ,params:{cmd:'load'} }); // any additional load click processing here } , // eo function onLoadClick submit:function() { if(this.getForm().isDirty()) { this.getForm().submit({ url:this.url ,scope:this ,success:this.onSuccess ,failure:this.onFailure ,params:{cmd:'cfg'} ,waitMsg:'正在保存，请稍候....' }); } }, // eo function submit onSuccess:function(form, action) { Ext.Msg.show({ title:'修改成功' ,msg:'修改成功！' ,modal:true ,scope:this ,fn:this.onFlush ,icon:Ext.Msg.INFO ,buttons:Ext.Msg.OK }); } ,// eo function onSuccess onFlush:function(form,action){ document.location.href="fcbmcfg.do?method=show"; //Ext.Ajax.request({url:"fcbm.do" , method:"POST" ,params:{method:"show"}}) ;// this.getForm().submit({// url:'fcbm'// ,scope:this// ,params:{method:'show'}// ,waitMsg:'ҳ����ת�У����Ժ�...'// }); }, onFailure:function(form, action) { this.showError(action.response.responseText); }, // eo function onFailure showError:function(msg, title) { title = title || 'Error'; Ext.Msg.show({ title:title ,msg:msg ,modal:true ,icon:Ext.Msg.ERROR ,buttons:Ext.Msg.OK }); }, // eo function showError reset:function(){ this.ownerCt.close(); } },this); //end extends // register xtype Ext.reg('fcForm', Tenpay.Form);Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = './ext/resources/images/default/s.gif'; Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; Ext.lib.Ajax.defaultPostHeader += '; charset=utf-8'; var isload = true; var bts; var tt; var jsData = Ext.get('datas'); if(jsData.dom.value=='' || jsData.dom.value=="") { isload = false; } if(isload) { bts = Ext.DomQuery.select("span input"); tt = Ext.util.JSON.decode(jsData.dom.value); Ext.each(bts,function(obj){ var btn = Ext.get(obj['id']); btn.on("click",function(){ var w= new Ext.Window({ layout:'fit', plain:true, width:500, height:410, title: '编辑负载均衡器信息', draggable: true�, closable: true, //closeAction:"hide", buttonAlign:'center', modal: true, items:{ id:'fcformload', xtype:'fcForm' }, listeners:{"show":function() { var form = Ext.getCmp('fcformload').getForm(); form.setValues(tt); }} }); w.show(); },this); }); var as = Ext.DomQuery.select("span a"); Ext.each(as,function(obj){ var a = Ext.get(obj['id']); var dp = Ext.get('d'+a.id); a.on("click",function(){ var win =new Ext.Window({ layout:'fit', plain:true, title:'查看负载均衡器配置信息', width:400, autoHeight:true, html:dp.dom.innerHTML, buttons:[{ text:"关闭", handler:function(){ win.hide(); }, scope:this }] }); win.show(a); }); },this); } });
页:
[1]