对Ext 模块化编程 研究了下。 还有 对异常的处理技巧 , 事件的公布 及 触发(可能有的叫法不同).
自己的感悟是 和JAVA语言 非常的相似。
测试页面只需一句JS就可以调用 很多功能。
此例: 在测试页面加上 Ext.onReady(function(){new ViewGrid();}); 即可
以下是 模板的代码:
欢迎各位 投蛋 ,意见.
ViewGrid = Ext.extend(Ext.grid.GridPanel,{
insertWin:null,
updateWin:null,
constructor:function(){
this.insertWin = new InsertWindowInfo();
this.updateWin = new UpdateWindowInfo();
ViewGrid.superclass.constructor.call(this,{
title:'GridPanel',
renderTo:Ext.getBody(),
width:320,
height:200,
tbar:[{
text:'添加人员',
handler:function(){
this.insertWin.show();
},scope:this
},'-',{
text:'修改人员',
handler:function(){
this.updateWin.show();
try{
var _r = this.getSelected();
this.updateWin.form.setValues(_r);
}catch(error){
Ext.Msg.alert(error.description);
this.updateWin.close();
}
},
scope:this
},'-',{
text:'删除人员',
handler:this.deleteEmp,
scope:this
}],
colModel:new Ext.grid.ColumnModel([{
header:'姓名'
},{
header:'性别'
},{
header:'年龄'
}]),
store:new Ext.data.JsonStore({
autoLoad:true,
data:[{name:'张翔',sex:'男',age:22},{name:'李慧敏',sex:'女',age:21}],
fields:['name','sex','age']
}),
selModel:new Ext.grid.RowSelectionModel({
singleSelect:true,
listeners:{
'rowselect':{
fn:function(_sel,_index,_r){
this.fireEvent('rowselect',_r);
},
scope:this
}
}
})
});
this.addEvents('rowselect');
this.insertWin.on('submit',this.onInsertWinSubmit,this);
this.updateWin.on('submit',this.onUpdateWinSubmit,this);
},
insertRecord:function(_r){
this.store.add(_r);
},
updateRecord:function(_r){
try{
var _nr = this.getSelected();
var _data = _r.data;
for(var i in _data){
_nr.set(i,_data[i]);
}
_nr.commit();
}catch(error){
alert(error.description);
}
},
deleteRecord:function(_r){
this.getStore().remove(_r);
},
onInsertWinSubmit:function(_win,_r){
this.insertRecord(_r);
},
getSelected:function(){
var sm = this.getSelectionModel();
if(sm.getCount() == 0)throw Error("请选择一条记录");
else return sm.getSelected();
},
onUpdateWinSubmit:function(_win,_r){
this.updateRecord(_r);
},
deleteEmp:function(_r){
try{
this.deleteRecord(this.getSelected());
}catch(error){
Ext.MessageBox.alert('系统提示','请选择一条记录');
}
}
});
//---------------------------------------------------------------------------------------------------------
FormInfo = new Ext.extend(Ext.form.FormPanel,{
constructor:function(){
FormInfo.superclass.constructor.call(this,{
frame:true,
defaultType:'textfield',
labelWidth:35,
//baseCls:'x-plain',
defaults:{'anchor':'95%'},
plain:true,
items:[{
fieldLabel:'姓名',
name:'name'
},{
fieldLabel:'年龄',
vtype:'age',
name:'age'
},{
fieldLabel:'性别',
name:'sex',
readonly:true,
xtype:'combo',
displayField:'sex',
mode:'local',
triggerAction:'all',
value:'男',
store:new Ext.data.ArrayStore({
fields:['sex'],
data:[['男'],['女']]
})
}]
});
},
getValues:function(){
if(this.getForm().isValid())
return new Ext.data.Record(this.getForm().getValues());
else
throw Error('没有通过验证');
},
setValues:function(_r){
this.getForm().loadRecord(_r);
},
reset:function(){
this.getForm().reset();
}
});
//-------------------------------------------------------------------------------------------------------------
WindowInfo =Ext.extend(Ext.Window,{
form:null,
constructor:function(){
this.form = new FormInfo();
WindowInfo.superclass.constructor.call(this,{
renderTo:Ext.getBody(),
width:300,
height:150,
plain:true,
items:this.form,
buttons:[{
text:'确定',
handler:this.onWindowSubmit,
scope:this
},{
text:'取消',
handler:this.onWindowCancel,
scope:this
}]
});
this.addEvents("submit");
},
close:function(){
this.form.reset();
this.hide();
},
onWindowSubmit:function(){
try{
this.fireEvent('submit',this,this.form.getValues());
}catch(error){
return ;
}
this.form.reset();
this.hide();
},
onWindowCancel:function(){
this.form.reset();
this.hide();
}
});
//-------------------------------------------------------------------------------------------------------
InsertWindowInfo = Ext.extend(WindowInfo,{
title:'添加人员'
});
//-------------------------------------------------------------------------------------------------------
UpdateWindowInfo = Ext.extend(WindowInfo,{
title:'修改人员'
});
- 大小: 4.4 KB
- 大小: 8.7 KB
分享到:
相关推荐
不过,最革命性的改变还是ExtJs中新增的Ext.Direct功能,它实现了服务器端的无关性。 在3.2版本中,Ext将增加移动组件,进军移动市场,这将是一次革命性的改进,同时在4.0版本中,除了对HTML5的支持外,还增加画布...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为...
- 远程下载加入进度条,下载速度等信息 ####fix bug:(bug解决和程序优化) - 下载前判断当前目录可写 - 文件扩展名处理,分为用户方式和扩展名权限方式 - 上传结束提示:是否成功、失败原因 - 上传扩展名限制 ...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为公钥...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为公钥...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为公钥...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为...
javax.security.auth.spi 此包提供用于实现可插入验证模块的接口。 javax.security.auth.x500 此包包含应该用来在 Subject 中存储 X500 Principal 和 X500 Private Crendentials 的类。 javax.security.cert 为...
2.3.7 添加/删除软件 36 2.4 位置菜单 36 2.4.1 主文件夹 38 2.4.2 桌面、文档等 39 2.4.3 计算机 39 2.4.4 CD/DVD刻录机 39 2.4.5 磁盘分区 40 2.4.6 网络 40 2.4.7 连接到服务器 41 2.4.8 搜索文件 41 2.4.9 最近...
2.3.7 添加/删除软件 36 2.4 位置菜单 36 2.4.1 主文件夹 38 2.4.2 桌面、文档等 39 2.4.3 计算机 39 2.4.4 CD/DVD刻录机 39 2.4.5 磁盘分区 40 2.4.6 网络 40 2.4.7 连接到服务器 41 2.4.8 搜索文件 41 2.4.9 最近...
此时会重新初始化 u 盘, 并采用每次读 1 扇区方式从失败处继续。 7.增强文件名识别,便于重命名。 7.1 文件名可以任意大小写,但是在 grldr.mbr 及 grldr.pbr 中必须大写。 7.2 在 grldr.pbr 中: FAT16、...
虚拟控制台的切换可以通过按下Alt键和一个功能键来实现,通常使用F1-F6 。 例如,用户登录后,按一下“Alt+ F2”键,用户就可以看到上面出现的“login:”提示符,说明用户看到了第二个虚拟控制台。然后只需按“Alt+...
内存模块上的EEPROM (只读存储器) 储存有关模块的重要参数信息,例如内存类型、大小、速度、电压接口及模块储存区域。 CAS Latency Time: 这个项目可控制DRAM读取指令与数据成为真正可用的时间之间的延迟时间。...
第3 章 Linux 编程环境................................................................................................................ 28 ║2 嵌入式系统开发技术详解——基于ARM 3.1 Linux 常用工具..........