相关的源代码如下: 1.beginFormPanel.js(作用:外层html文件中表单的展现) <script> var beginFormPanel = Ext.extend(Ext.form.FormPanel,{ constructor:function() { beginFormPanel.superclass.constructor.call ( this, { title:"myForm(绝不裸奔)", width:418, height:180, frame:true, labelWidth:45, style:"margin-left:250px", defaultType:"textfield", defaults:{anchor:"95%"}, items: [ { fieldLabel:"姓名", name:"name" }, { fieldLabel:"年龄", name:"age" }, { fieldLabel:"性别", name:"sex" }, { fieldLabel:"住址", name:"addr" } ], buttons: [ { text:"添加" }, { text:"修改" }, { text:"删除" } ], renderTo:Ext.getBody() } ) ; } }) ; </script> 2.beginPanel.js(作用:GridPanel与窗口以及窗口中FormPanel的实现) <script> /**************************** FormPanel *****************************************************/ var myWindowForm = Ext.extend(Ext.form.FormPanel,{ constructor:function() { myWindowForm.superclass.constructor.call ( this, { labelWidth:45, defaultType:"textfield", defaults:{anchor:"93%"}, style:"padding:5px", baseCls:"x-plain", items: [ { fieldLabel:"姓名", name:"name", allowBlank:false, blankText:"姓名不能够为空!" }, { fieldLabel:"年龄", name:"age", allowBlank:false, vtype:"age", blankText:"年龄不能够为空!" }, { fieldLabel:"性别", name:"sex", allowBlank:false, blankText:"性别不能够为空!" }, { fieldLabel:"住址", name:"addr", allowBlank:false, blankText:"住址不能够为空!" } ] } ) ; }, getValues:function() { if(this.getForm().isValid()) { return new Ext.data.Record(this.getForm().getValues()) ; } else { throw error("表单验证没通过哦!") ; } }, setValues:function(record) { this.getForm().loadRecord(record) ; }, reset:function() { this.getForm().reset() ; } }) ; /******************************** Window ***********************************/ var myWindow = Ext.extend(Ext.Window,{ form:new myWindowForm(), constructor:function() { myWindow.superclass.constructor.call ( this, { title:"myWindow(绝不裸奔)", width:300, height:185, frame:true, plain:true, modal:true, items:this.form, closable:false,//禁止关闭 collapsible:true,//可折叠 buttons: [ { text:"确定", handler:this.onSubmitClick, scope:this }, { text:"取消", handler:this.onCancelClick, scope:this } ] } ) ; this.addEvents("submit") ; }, close:function() { this.hide() ; }, onSubmitClick:function() { /* try { this.fireEvent("submit",this,this.form.getValues()) ; } catch (error) { Ext.Msg.alert("警告","请将需要填写的信息填写完整!") ; } */ this.fireEvent("submit",this,this.form.getValues()) ; this.close() ; }, onCancelClick:function() { //上面不加scope属性则提示this.form为空 this.form.reset() ; this.close() ; } }) ;