Extjs Formpanel code 例子

benlsoft

/* * 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 onLoadClick  submit: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[type=button]");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[btn.id]);        }}});                     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 onRender  submit: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[type=button]");    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[btn.id]);                                 }}                        });                        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);   }    });