Extjs 도시 상호 연결 간단한 예

2641 단어 htmlext

 
Ext.onReady(function(){

	// 
	var dataProvice=[
	  [' ',' '],
	  [' ',' ']
	];
	
	// 
	var dataCityGuangDong=[
	  [' ',' '],
	  [' ',' '],
	  [' ',' '],
	  [' ',' '],
	  [' ',' '],
	  [' ',' '],
	  [' ',' ']
	];
	
	// 
	var dataCityJiangSu=[
	  [' ',' '],
	  [' ',' '],
	  [' ',' ']
	];
	
	
	
	// 
	var storeProvice=new Ext.data.SimpleStore({
	    fields:['value','text'],
	    data:dataProvice
	});

	// 
	var storeCity=new Ext.data.SimpleStore({
        fields:['value','text'],
        data:[]
	});
	
	
	// 
	var comboCity=new Ext.form.ComboBox({
	   store:storeCity,
	   emptyText:' ',
	   mode:'local',
	   triggerAction:'all',
	   valueField:'value',
	   displayField:'text',
	   readOnly:false
	});
	
	// 
	var comboProvice=new Ext.form.ComboBox({
		store:storeProvice,
		emptyText:' ',
		mode:'local',
		triggerAction:'all',
		valueField:'value',
		displayField:'text',
		readOnly:false
		
	});
	
	comboProvice.on('select',function(comboBox){
	   var provice=comboBox.getValue();
	   if(provice==' '){
	      storeCity.loadData(dataCityGuangDong);
	   }else if(provice==' '){
	       storeCity.loadData(dataCityJiangSu);
	   }
	});
	
	comboProvice.render('comboProvice');
	comboCity.render('comboCity');
	
	var upload=new Ext.form.FormPanel({
	    labelAlign:'right',
	    title:'upload plane',
	    labelWidth:50,
	    frame:true,
	    fileUpload:true,
	    width:280,
	    items:[{
	       xtype:'textfield',
	       fieldLabel:' ',
	       name:'file',
	       inputType:'file'
	    }]
	});
    upload.render('upload');
	
});
 html :
<input id="comboProvince" type="text"/><input id="comboCity" type="text"/>

좋은 웹페이지 즐겨찾기