extjs combox

 //----------------------下拉列表开始----------------------//
157             //创建数据源[数组数据源]
158             var combostore = new Ext.data.ArrayStore({
159                 fields: ['id', 'name'],
160                 data: [[1, '团员'], [2, '党员'], [3, '其他']]
161             });
162             //创建Combobox
163             var combobox = new Ext.form.ComboBox({
164                 fieldLabel: '政治面貌',
165                 store: combostore,
166                 displayField: 'name',
167                 valueField: 'id',
168                 triggerAction: 'all',
169                 emptyText: '请选择...',
170                 allowBlank: false,
171                 blankText: '请选择政治面貌',
172                 editable: false,
173                 mode: 'local'
174             });
175             //Combobox获取值
176             combobox.on('select', function () {
177                 alert(combobox.getValue());
178             })
179             //----------------------下拉列表结束----------------------//

 

 

 

209 <!--
210 说明：
211 (1)var combostore = new Ext.data.ArrayStore():创建一个新的数组数据源。
212 (2)fields: ['id', 'name']：数据源包含两列，列名分别为'id','name'。
213 (3)data: [[1, '团员'], [2, '党员'], [3, '其他']]:数据源对应的数据，例：id:1,name:团员。
214 (4)var combobox = new Ext.form.ComboBox()：创建一个新的下拉列表。
215 (5)store: combostore:数据源为上面创建的数据源，这个属性是combobox的必需属性。
216 (6)displayField: 'name',valueField: 'id'：combobox对应数据源的显示列与值列，这两个属性也是必须的。
217 (7)mode: 'local'：指定数据源为本地数据源，如果是本地创建的数据源，该属性也是必须的，如果数据源来自于服务器，
218     设置为'remote'表示数据源来自于服务器，关于服务器交互后面我们会讲解。
219 (8)triggerAction: 'all'：请设置为”all”,否则默认 为”query”的情况下，你选择某个值后，再此下拉时，只出现匹配选项，
220     如果设为all的话，每次下拉均显示全部选项。
221 (9)editable: false:默认情况下，combobox的内容是可以编辑的，该属性设置为false，
222     使下拉列表只能选择不能编辑。
223 (10)combobox.on('select', function () {alert(combobox.getValue());}):选择时alert出下拉列表的值。
224 -->

 

 

3.说明：

combo这个组件是需要绑定一个数据源才能使用,所以store和displayField和valueField是必须的

4.常用属性

1.valueField:"字符型"，value值字段
2.displayField："字符型",显示文本字段
3.editable：false//false则不可编辑，默认为 true
4.triggerAction:”all”//请设置为”all”,否则默认 为”query”的情况下，你选择某个值后，再此下拉时，只出现匹配选项，如果设为”all”的话，每次下拉均显示全部选项
5.hiddenName:string //真正提交时此combo的name，请一定要注意。
6.typeAhead:true,//延时查询，与下面的参数配合
7.typeAheadDelay:3000,//默认250