extjs ComboBox联动下拉菜单示例

var provinces = [[1,'北京'],[2,'上海']];   

var cities = new Array();    

cities[1] = [[11,'海淀'],[22,'东城']];    

cities[2] = [[33,'黄埔'],[44,'浦东'],[55,'静安']];   

  

var comboProvinces = new Ext.form.ComboBox({   

  

           store: new Ext.data.SimpleStore(  {   

                   fields: ["provinceId", "provinceName"],   

                   data: provinces   

          }),   

  

           listeners:{   

                  select:function(combo, record,index){   

                         comboCities.clearValue();   

                         comboCities.store.loadData(cities[record.data.provinceId]);   

                 }   

          },   

  

          valueField :"provinceId",   

          displayField: "provinceName",   

          mode: 'local',   

          forceSelection: true,   

          blankText:'请选择省份',   

          emptyText:'请选择省份',   

          hiddenName:'provinceId',   

          editable: false,   

          triggerAction: 'all',   

          allowBlank:true,   

          fieldLabel: '请选择省份',   

          name: 'provinceId',   

          width: 80    

  

});   

  

 var comboCities = new Ext.form.ComboBox({   

            store: new Ext.data.SimpleStore(  {   

                        fields: ["cityId",'cityName'],   

                       data:[]   

            }),   

  

            valueField :"cityId",   

            displayField: "cityName",   

            mode: 'local',     

            forceSelection: true,   

            blankText:'选择地区',   

            emptyText:'选择地区',   

            hiddenName:'cityId',   

            editable: false,   

            triggerAction: 'all',   

            allowBlank:true,   

            fieldLabel: '选择地区',   

            name: 'cityId',   

            width: 80   

});   

 

ComboBox控件的id和hiddenName不要设置成一样，否则会选不中选项，不知道是不是ComboBox的一个bug。