ExtJS中ComboBox联动菜单－例码（本地数据）

部分资料来自：《JavaScript凌厉开发－Ext详解实践》

 

 1 ///<reference path="vswd-ext_2.0.2.js">
 2 Ext.onReady(function() {
 3     var cities = [['北京',
 4         [
 5             ['北京'],
 6             ['通县'],
 7             ['昌平'],
 8             ['大兴'],
 9             ['密云'],
             ['顺义'],
             ['平台']
         ]],
         ['广东',
             [
                 ['潮州'],
                 ['汕头']
             ]
         ]
     ];
 
     var localProvince = new Ext.data.SimpleStore({
         fields: ['provinces', 'cities'],
         data: cities
     });
 
     var localcities = new Ext.data.SimpleStore({
         fields: ['cities'],
         data: []
     });
 
     var frm = new Ext.form.FormPanel({
         title: 'combo',
         width: 300,
         autoHeight: true,
         applyTo: 'con',
         frame: true,
         labelWidth: 50,
         labelAlign: 'right',
         items: [
             {
                 xtype: 'combo',
                 triggerAction: 'all',
                 anchor: '80%',
                 fieldLabel: 'Provinces',
                 editable: false,
                 mode: 'local',
                 store: localProvince,
                 displayField: 'provinces',
                 name: 'provinces',
                 listeners: {
                     select: function(form, rec, index) {
                         frm.getForm().findField('cities').clearValue();
                         localcities.loadData(rec.get('cities'));
                     }
                 }
             }, {
                 xtype: 'combo',
                 triggerAction: 'all',
                 anchor: '80%',
                 fieldLabel: 'cities',
                 editable: false,
                 name: 'cities',
                 mode: 'local',
                 displayField: 'cities',
                 store: localcities
             }
         ]
     });
 });