Ext 简单级联入门

这是一个静态数据的级联:
Ext.onReady(function(){
    var sheng = [['上海','上海'],['北京','北京'],['广东','广东']];
    var shs = [['埔东','埔东'],['埔西','埔西'],['埔南','埔南']];
    var bjs = [['人民大会堂','人民大会堂'],['天桥','天桥'],['中关村','中关村']];
    var gds = [['中山','中山',],['广州','广州',],['东莞','东莞']];
    
    //上海
    var shStore = new Ext.data.SimpleStore({
      fields:['value','text'],
      data:shs
    }); 
    //北京
    var bjStore = new Ext.data.SimpleStore({
      fields:['value','text'],
      data:bjs
    });
    //广东
    var gdStore = new Ext.data.SimpleStore({
      fields:['value','text'],
      data:gds
    });     
 //数据   
    var shengStore = new Ext.data.SimpleStore({
      fields:['value','text'],
      data:sheng
    });
    var shiStore = new Ext.data.SimpleStore({
      fields:['value','text'],
      data:[]
    });
    
   //控件 省份
    var shengCom = new Ext.form.ComboBox({
        store: shengStore,
        emptyText: '请选择',
        mode: 'local',
        triggerAction: 'all',
        valueField: 'value',
        displayField: 'text',
        readOnly: true,
        applyTo : 'shengCom'
    });
    // 市区
    var shiCom = new Ext.form.ComboBox({
        store :   shiStore,
        emptyText: '请选择',
        mode: 'local',
        triggerAction: 'all',
        valueField: 'value',
        displayField: 'text',
        readOnly: true,

        applyTo : 'shiCom'
    });  
    shengCom.on("select",function(comboBox){
       var province = comboBox.getValue();      
       shiCom.reset();   //这个一定要,重置,要不然上次选择的信息会还在,弄了我好久
       if(province=='上海'){  
          shiStore.loadData(shs)
      }
      if(province=='北京'){
         shiStore.loadData(bjs)
      }
      if(province=='广东'){
        shiStore.loadData(gds)
      }
    });

});

页面加两行就行了:
	
    <body>           
        <input id='shengCom',type='text'/>
        <input id='shiCom',type='text'/>
    </body>


你可能感兴趣的:(ext)