天天看點

Ext.form.ComboBox 遠端帶分頁顯示

很多時候針對大資料量的下拉清單的時候,我們通常需要分頁顯示資料,就像grid一樣

效果:

[img]http://dl.iteye.com/upload/attachment/559314/04850ba2-dc28-3de5-a990-8df4be975da9.jpg[/img]

//這裡是Store
var store = new Ext.data.JsonStore({
	root: 'rows',//
        totalProperty: 'total',//顯示總頁數的字段
	idProperty: 'ID',//記錄ID的字段
	remoteSort: true,//是否為遠端
	baseParams :{start:0,limit:15},
	proxy: new Ext.data.ScriptTagProxy({
		url: '/ah/policies/12/insures'
	}),
	fields: [
		{name:'ID',mapping:'ID'},
		{name:'Name',mapping:'Name'},
                {name:'IdNo',mapping:'IdNo'}
		]

});

//下面是應用,pageSize 最重要的就是這個參數,即每次查詢多少條記錄,每天這個參數就不會顯示頁面工具欄了,其他參數沒什麼解釋的
//tpl 我們可以加上tpl顯示資訊
{
        xtype:'combo',
        tpl:'<tpl for="."><div ext:qtip="提示:名字({Name}),證件号碼({IdNo})" class="x-combo-list-item">{Name}-{IdNo}</div></tpl>',
        fieldLabel: '被保險人',
	store:_this.store,
	emptyText : '請選擇投保人',
	allowBlank:false,
	hiddenName:'PlanID',
	loadingText: 'searching...',
	displayField : 'Name',
	mode:'remote',
	editable : false,
	valueField: 'ID',
	anchor : '68%',
	hiddenName:'RecordID',
	pageSize:15,
	triggerAction: 'all'
}