您的位置:首页 > Web前端 > JavaScript

Extjs学习总结之10数据与ComboBox

2011-12-02 11:57 274 查看
写这个时候发现第八章我没有写笔记,因为第八章比较抽象,我没有写。然后理论也比较多。所以如果你有兴趣就去找pdf文档看看吧。



至于这个数据与ComboBox,其实就是页面中的数据我们如何获取如何显示的问题。Extjs使用Combobox来获取和显示,但也有步骤,看代码吧:

Ext.onReady(function(){
	/*
	 * DataProxy:获取想要的数据,通过他能得到来自不同地方的数据,比如数组,远程服务器,并组织成不同的格式。
	 * 		* MemoryProxy/HttpProxy/ScriptTagProxy 
	 * DataReader:定义数据项的逻辑结构,一个数据项有很多列,每列名称,数据类型,都由该类定义。
	 * Store:存储器,用于整合Proxy和Reader,控件索取数据时通常和他打交道。
	 */	
	
	//构建DataProxy
	var cities=[
		[1,"长沙市"],
		[2,"株洲市"],
		[3,"湘潭市"],
		[4,"济南市"]
	];
	var proxy = new Ext.data.MemoryProxy(cities);
		
	//构建DataReader
	var City = Ext.data.Record.create([
		{name:"cid",type:"int",mapping:0},
		{name:"cname",type:"string",mapping:1}
	]);
	var reader = new Ext.data.ArrayReader({},City);
	//var reader = new Ext.data.ArrayReader({},[]);
	
	//构建Store
	var store = new Ext.data.Store({
		proxy:proxy,
		reader:reader,
		autoLoad:true
	});
	
	combobox = new Ext.form.ComboBox({
		renderTo:Ext.getBody(),
		triggerAction:"query",
		store:store,
		displayField:"cname",
		valueField:"cid",
		mode:"local",
		emptyText:"请选择城市"
	});
	
	var btn = new Ext.Button({
		text:"列表框的值",
		renderTo:Ext.getBody(),
		handler:function(){
			Ext.Msg.alert("值","实际值:"+combobox.getValue()+":显示值"+combobox.getRawValue());
			combobox.reset();
		}
	});
});


内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: