Module.js文件的编写规范
2012-01-18 22:35
337 查看
在模块化后,每个模块应按如下方式编写:(需注意以下内容的和注释方式)
Ext.namespace("modScoreManage"); /**文件名: Module.js * 功能: 作为显示成绩信息页面的模块。 该文件中包含作为Module类主体的一个类的定义。 * @author William * @lastEdit William * @version 2012/1/12 * */ /*----------------------------------- 定义 GridStudent---------------------------------------*/ /**类名:成绩信息Grid * @author William * @lastEdit William * @version 2012/1/12 * */ modScoreManage.GridStudent = Ext.extend(Ext.grid.GridPanel,{ // 属性代码 viewConfig : { forceFit : true } /*-----------------------------------GridStudent 的构造函数---------------------------------------*/ ,constructor:function(){ // 创建所需成员 this.nRecordStart = 0; this.nPageSize = 10; this.store = global.util.Stores.getStudentsStore(); this.store.load({params:{start:this.nRecordStart,limit:this.nPageSize}}); this.cmScore = new Ext.grid.ColumnModel([ {header:'学号',dataIndex:'id', width:20} ,{header:'姓名',dataIndex:'name'} ,{header:'性别',dataIndex:'gender'} ,{header:'生日',dataIndex:'birthday', renderer :global.util.Render.renderDate('Y-m-d')} ,{header:'年龄',dataIndex:'age'} ,{header:'班级',dataIndex:'clazz_id'} ]); this.cmScore.defaultSortable = true; /*----------------------------------- 调用父类构造函数---------------------------------------*/ modScoreManage.GridStudent.superclass.constructor.call(this,{ // 属性设置 loadMask:{ msg:'数据加载中...' } ,title:'学生信息管理' ,cm:this.cmScore ,stripeRows : true ,split : true //视图代码全部写在这里 ,bbar:{ xtype:'paging' ,pageSize:this.nPageSize ,store:this.store ,displayInfo:true ,displayMsg:'显示第{0}条到第{1}条记录,一共{2} 条记录' ,emptyMsg:'没有记录' } ,tbar:[ { xtype:'button' ,text:'修改' // ,iconCls:'editpart' } ,'-' ,{ xtype:'button' ,text:'删除' ,iconCls:'deletepart' } ] }); /*----------------------------------/ 调用父类构造函数---------------------------------------*/ // 创建事件侦听器 this.getTopToolbar().findByType('button')[0].on('click',this.onBtnEdit,this); this.getTopToolbar().findByType('button')[1].on('click',this.onBtnDelete,this); } /*----------------------------------/GridStudent 的构造函数---------------------------------------*/ /**创建编辑信息表单 * @author William * @lastEdit William * @version 2012/1/12 * */ ,createEditForm:function(sName,sGender,dBirthday,nAge,nClazzId,sId){ var frmEdit = new modScoreManage.EditForm(sName,sGender,dBirthday,nAge,nClazzId,sId); var wndEdit = new modScoreManage.FormWnd("修改学生信息", frmEdit ); wndEdit.show(); } /**弹出删除确认提示框 * @author William * @lastEdit William * @version 2012/1/12 * */ ,createDelConfirmBox:function(recSelected){ Ext.Msg.confirm('确定','您确定要删除 '+ recSelected.get('name') + " 吗?", function(btn){ if(btn =='yes'){ /*-------------- 发送请求----------------*/ Ext.Ajax.request({ url:'student_delete.do', // 删除功能现在在action中被注释掉了。 params:{ // sId:slId }, scope:this, success: function(){ this.store.remove(recSelected); this.store.reload(); Ext.Msg.show({ title:'提示', msg:'删除成功', icon:Ext.Msg.OK, buttons:Ext.MessageBox.OK }); } }); /*-------------/ 发送请求----------------*/ } } ,this ); } /*--------------------------------/this的方法-----------------------------------*/ /*-----------------------------------------------事件处理函数-------------------------------------------------*/ /**编辑按钮的事件处理函数 * @author William * @lastEdit William * @version 2012/1/12 * */ ,onBtnEdit:function(){ //判断是否选中了修改的记录 var recSelected = this.getSelectionModel().getSelected(); //根据判断结果处理 if(!recSelected){ //如果没有选中记录 Ext.Msg.show({ title:'提示', msg:'没有选中要修改的记录', icon:Ext.MessageBox.Error, buttons:Ext.MessageBox.OK }); } else{ //如果选中了某条记录 //得到选中grid中的对象的属性值 var sId = recSelected.get('id'); // 注意,这里一定要采用匈牙利命名法来标注变量属性 var sName = recSelected.get('name'); var sGender = recSelected.get('gender'); var dBirthday = recSelected.get('birthday'); var nAge = recSelected.get('age'); var nClazzId = recSelected.get('clazz_id'); // 创建表单 this.createEditForm(sName,sGender,dBirthday,nAge,nClazzId,sId); } } /**删除按钮的事件处理函数 * @author William * @lastEdit William * @version 2012/1/12 * */ ,onBtnDelete:function(){ //判断是否选中了修改的记录 var recSelected = this.getSelectionModel().getSelected(); //根据判断结果处理 if(!recSelected){ Ext.Msg.show({ title:'提示', msg:'没有选择相应的数据', icon:Ext.Msg.Error, buttons:Ext.MessageBox.OK }); return; }else{ // 弹出确认提示框 this.createDelConfirmBox(recSelected); } } /*----------------------------------------------/事件处理函数-------------------------------------------------*/ }); /*----------------------------------/ 定义 GridStudent---------------------------------------*/ Ext.extend(main.Module,{ init:function(){ // 创建Module中所需对象 this.gridStudent = new modScoreManage.GridStudent(); // 添加事件 // 将母体组件添加到this.main(那个tab)中 this.main.add(this.gridStudent;); this.main.doLayout(); } /*---------------------------------this的方法-----------------------------------*/ /*--------------------------------/this的方法-----------------------------------*/ /*-----------------------------------------------事件处理函数-------------------------------------------------*/ /*----------------------------------------------/事件处理函数-------------------------------------------------*/ });
相关文章推荐
- 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)
- 如何编写JS文件
- JAR包中的MANIFEST.MF文件详解以及编写规范
- 使用subline实现vue文件的高亮显示以及html和js的快速编写
- ceph存储 Linux下rpm制作中spec文件编写规范
- 编写Darwin的Module来支持新的流媒体文件格式
- 如何为开发项目编写规范的README文件(windows)
- 输出和引入js文件 module.exports
- 如何为开发项目编写规范的README文件(足球竞猜源码下载),此文详解
- 关于HttpModule中像图片,*.css,*.js等资源文件也被请求问题的解决
- js 编写规范
- JS编写规范
- 使用requireJS加载不符合AMD规范的js文件:shim的使用方式和实现原理
- 个人总结的编写JS的规范
- Node.js node主文件找不到时报出的Error:Cannot find module异常
- 编写 jsp文件时需要加的一些规范
- 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)
- js学习笔记-编写高效、规范的js代码-Tom
- js文件命名规范
- 编写Darwin的Module来支持新的流媒体文件格式