combobox在整个页面中也是非常重要的一个控件,接下来就好好说一下这个控件是怎么来运用的:
1、运用json来取得数据
Ext.onReady(function () { var combo = new Ext.form.ComboBox({ store:<%=ServerData %>, //json applyTo:"combo" //combobox的ID }); });
并且在后台的cs代码中添加public string ServerData=”['湖北','江西','安徽']“;(是放在类中,而不是放在方法里)
2、运用数据源store格式
//提供数据: var data=[[' 湖北','hubei'],['江西','jiangxi'],['安徽','anhui']]; //导入到store中,store的类型包括GroupingStore,JsonStore,SimpleStore: var store = new Ext.data.SimpleStore({ fields: ['chinese', 'english'], data : data }); //把store托付给comboBox的store var combo = new Ext.form.ComboBox({ store: store, displayField:’english’,//store字段中你要显示的字段,多字段必选参数,默认当mode为remote时displayField为undefine,当 select列表时displayField为”text” mode: ’local’,//因为data已经取数据到本地了,所以’local’,默认为”remote”,枚举完 emptyText:’请选择一个省 份…’, applyTo: ’combo’ });
3、把combobox样式运用到select下拉框
//js代码 var ExtSelect=new Ext.form.ComboBox({ transform:”select”,//html中的id 80//宽度 }); //html代码 <select id=”select”> <option value=”1″>***</option> <option value=”2″>博客园</option> <option value=”3″>百度</option> <option value=”4″>新浪</option> </select>
4、combobox的一些事件
写在listeners下:
View Code
1 listeners : { 2 select : function(f, r, i) { 3 if (i == 0) { 4 ... 5 } else { 6 ... 7 }