ExtJs中常常会用到ComboBox下拉列表来显示数据,但是如果数据过于多了,那么通常采用分页的技术。最近在做一个项目时候,遇到了下拉表中的数据读取出来了,但是却没有没有分页,我的主要代码如下:
1.得到store,即需要在ComboBox下拉列表中显示的数据。
var spCode = new Ext.data.Store({ url:'business!getAllBusiOfParent.action', autoLoad:true, params:{start:0}, remoteSort: true, reader:new Ext.data.JsonReader({ root: "data", totalProperty:'total' },[ {name:"bizcode"}, {name:"bizname"} ] ) });
2.将store放到ComboBox中并进行分页
var spCombo = new Ext.form.ComboBox({ hiddenName : 'bizcode', fieldLabel : '业务名称', emptyText:'请选择业务名称', mode : 'local', triggerAction : 'all', valueField : 'bizcode', displayField : 'bizname', editable : true, forceSelection:true, allowBlank:true, pageSize:4, store : spCode, width:210, maxHeight:100, listeners : { 'beforequery':function(e){ var combo = e.combo; if(!e.forceAll){ var input = e.query; combo.store.baseParams={query:input,limit:combo.pageSize}; combo.store.load(); return false; } } }
这里分页的图标也出来了,但是显示的是所有的数据,分页并没有成功。后面仔细的检查代码,发现了triggerAction这个属性设置为了all,需要将其改为query即可。为all的话,则显示出所有的数据,如果为query有个问题就是,如果每次查询之后,都需要清空查询结果才能重新显示出数据。