Extjs模块中组件的编写规范

请注意，组件的类定义中，不允许使用new来定义子成员，若有必要，则使用xtype。

Ext.ns("modScoreManage.EditForm");/** 放置在一个window中的用于编辑学生信息的表单 * @arguments String:sName,sGender,dBirthday,nAge,nClazzId,sId 分别为学生的各项信息 * @author William * @lastEdit William * @version 2012/1/12 * */modScoreManage.EditForm = Ext.extend(Ext.FormPanel,{//初始化组件  constructor:function(sName,sGender,dBirthday,nAge,nClazzId,sId){   // 变量定义this.nFormWidth = 280;this.nLabelWidth = 45;this.storeStudentsData = global.util.Stores.getStudentsStore();// 调用父类构造函数modScoreManage.EditForm.superclass.constructor.call(this,{labelWidth:this.nLabelWidth,frame:true,bodyStyle:'padding:5px 5px 5px',width:this.nFormWidth,autoHeight:true,waitMsgTarget:true,reader:this.reader,defaultType:'textfield'  /*---------------------定义表单中包含的控件----------------------*/   ,items:[{  fieldLabel:'姓名',  name:'EditForm_sName',  value:sName,  allowBlank:false  },{   fieldLabel:'性别',  name:'EditForm_sGender',  value:sGender,  allowBlank:false  }  ,{  xtype:'datefield' // 使用xtype来实现对象延迟创建  ,fieldLabel:'生日'  ,name:'EditForm_dBirthday'  ,value:dBirthday  ,format:'Y-m-d'  // 注意这里 y 的大小写是有区别的。  }//  ,new Ext.form.DateField({//  fieldLabel:'生日'//  ,name:'EditForm_dBirthday'//  ,value:dBirthday//  ,format:'Y-m-d'  // 注意这里 y 的大小写是有区别的。//  }) ,{fieldLabel:'年龄',  name:'EditForm_nAge',  value:nAge,  allowBlank:true },{fieldLabel:'班级',  name:'EditForm_nClazzId',  value:nClazzId,  allowBlank:true  },{   name:'EditForm_sId',  hidden:true,   // hidden 和 hideLabel同时设置才能隐藏这个表单域  hideLabel:true,  value:sId  }  ] ,buttons: [{          text:'修改',          disabled:false,          handler:this.onBtnEditClick          },{  text:'取消',  handler:this.onBtnCancelClick          }]    /*--------------------/定义表单中包含的控件----------------------*/});       }  /*------------------------------Methods------------------------------------------*//**销毁该表单窗口 * @author William * */,destroyWnd:function(){this.ownerCt.destroy();}/*-----------------------------/Methods------------------------------------------*//*------------------------------Event Handlers-----------------------------------*/,onBtnEditClick:function(){// 将提交按钮禁用，防止用户重复提交this.setDisabled(true); // 发送表单提交请求    this.ownerCt.ownerCt.getForm().submit({  url:'student_edit.do',  method:'POST',  scope:this.ownerCt.ownerCt, // 回到formPanel这一层    /*------------------------------请求返回的处理------------------------------*/  success: function(form,action){  Ext.Msg.alert('信息','信息修改成功',function(){                });  this.storeStudentsData.reload(); this.destroyWnd();   },  failure: function(form,action){           Ext.Msg.show({           title: '信息提示',           icon:Ext.MessageBox.QUESTION,           msg:'修改失败',           buttons:Ext.MessageBox.OK           });           this.storeStudentsData.reload();            this.destroyWnd();  }  /*-----------------------------/请求返回的处理------------------------------*/  });    }    ,onBtnCancelClick:function() {    // 这里的this是 Cancel按钮    this.ownerCt.ownerCt.destroyWnd();         }      /*-----------------------------/Event Handlers-----------------------------------*/  // 注册该类Ext.reg('modScoreManage_EditForm', modScoreManage.EditForm );});

针对若干特定组件：

1. Ext.window组件，必须设置 constrainHeader:true 。保证window不超过浏览器顶端。