ComboBox的测试,有几个方法没写完整,有待之后解决。。。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Combobox测试</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js">
</script>
<script type="text/javascript" src="../../ext-all.js">
</script>
<script type="text/javascript" src="../../build/locale/ext-lang-zh_CN.js">
</script>
<script language="javascript">
Ext.onReady(function(){
var JOB = Ext.data.Record.create([{name:"job"}]);
var win = new Ext.Window({
title:"ComboBox测试",
layout:"form",
labelWidth:45,
plain:true,
bodyStyle:"padding:5px",
width:200,
height:100,
//defaults:[{xtype:"textfield",width:55}],
items:[{
fieldLabel:"职位",
width:90,
baseCls:"x-plain",
xtype:"combo",
mode:"local",
displayField:"job",
triggerAction:"all",
value:"工程师",
store:new Ext.data.SimpleStore({fields:["job"],
data:[["工程师"],["经理"]]})
},{
layout:"column",
baseCls:"x-plain",
items:[{
xtype:"button",
columnWidth:.3,
//width:40,
text:"添加",
listeners:{
"click":function(){
var _job = win.findByType("combo")[0];
Ext.MessageBox.prompt("添加","请输入要添加的职位名称:",function(_btn,_text){
if(_btn == "ok"){
//Ext.MessageBox.alert(_job.getValue(),_text);
_job.getStore().insert(0,new JOB({job:_text}));
this.setValue(_text) ;
}
},_job)
}
}
},{
xtype:"button",
columnWidth:.3,
//bodyStyle:"padding-left:5px",
//width:40,
text:"修改",
listeners:{
"click":function(){
var _job = win.findByType("combo")[0];
Ext.MessageBox.prompt("修改","请修改相应的职位名称:",function(_btn,_text){
if(_btn == "ok"){
//_job["selectItem"].set("job",_text); //这个方法好像不起作用
_job.setValue(_text); //只能做临时的修改,不会改变comboBox选项的内容的,要修改的话可以修改store
}
},_job,false,_job.getValue())
}
}
},{
xtype:"button",
columnWidth:.3,
//bodyStyle:"padding-left:5px",
//width:40,
text:"删除",
listeners:{
"click":function(){
var _job = win.findByType("combo")[0];
Ext.MessageBox.confirm("注意","真要删除吗?",function(_btn){
if(_btn == "yes"){
//在这里删除comboBox里面的相应信息。
}
},_job)
}
}
}]}]
}).show();
});
</script>
</head>
<body>
</body>
</html>