Ext.form.ComboBox 属性详解及使用方法介绍和级联使用

 属性

    id:'cbid',
    name:'year',//name只是改下拉的名称
    hiddenName:'hyear',//提交到后台的input的name(重要)
    width : 80,
    store : Wayfoon.Year,//填充数据
    emptyText : '请选择',
    mode : 'local',//数据模式，local代表本地数据
    readOnly : true,//是否只读
    value : (new Date()).YEAR,//默认值,要设置为提交给后台的值，不要设置为显示文本
    triggerAction : 'all',// 显示所有下列数据，一定要设置属性triggerAction为all
    allowBlank : false,//不允许为空
    valueField : 'value',//值
    displayField : 'text',//显示文本
    editable: false,//是否允许输入
    forceSelection: true,//必须选择一个选项
    blankText:'请选择'//该项如果没有选择，则提示错误信息


例子:

Java代码  

1. Ext.onReady(function() {   
2.             var provinces = [[1, '北京'], [2, '上海']];   
3.             var cities = new Array();   
4.             cities[1] = [[11, '海淀'], [22, '东城']];   
5.             cities[2] = [[33, '黄埔'], [44, '浦东'], [55, '静安']];   
6.   
7.             var comboProvinces = new Ext.form.ComboBox({   
8.             store : new Ext.data.SimpleStore({   
9.                         fields : ["provinceId", "provinceName"],   
10.                         data : provinces   
11.             }),   
12.             listeners : {   
13.                 select : function(combo, record, index) {   
14.                     comboCities.clearValue();   
15.                     comboCities.store   
16.                             .loadData(cities[record.data.provinceId]);   
17.                 }   
18.             },   
19.             valueField : "provinceId",   
20.             displayField : "provinceName",   
21.             mode : 'local',   
22.             forceSelection : true,   
23.             blankText : '请选择省份',   
24.             emptyText : '请选择省份',   
25.             hiddenName : 'provinceId',   
26.             editable : false,   
27.             triggerAction : 'all',   
28.             allowBlank : true,   
29.             fieldLabel : '请选择省份',   
30.             name : 'provinceId',   
31.             width : 80  
32.         });   
33.         var comboCities = new Ext.form.ComboBox({   
34.             store : new Ext.data.SimpleStore({   
35.                         fields : ["cityId", 'cityName'],   
36.                         data : []   
37.             }),   
38.             valueField : "cityId",   
39.             displayField : "cityName",   
40.             mode : 'local',   
41.             forceSelection : true,   
42.             blankText : '选择地区',   
43.             emptyText : '选择地区',   
44.             hiddenName : 'cityId',   
45.             editable : false,   
46.             triggerAction : 'all',   
47.             allowBlank : true,   
48.             fieldLabel : '选择地区',   
49.             name : 'cityId',   
50.             width : 80  
51.         });   
52.        var form = new Ext.form.FormPanel({   
53.             region: 'center',   
54.             labelWidth: 100,   
55.             border: false,   
56.             labelAlign: 'right',   
57.             applyTo: 'select-div',   
58.             height: 200,   
59.             width: 400,   
60.             layout: 'form',   
61.             items: [comboProvinces, comboCities]   
62.         });   
63. })