读书人

哪位用过extjs的么?Ext.grid.GridPan

发布时间: 2013-01-28 11:49:56 作者: rapoo

哪位用过extjs的么?Ext.grid.GridPanel 分页问题,麻烦来看看
Ext.grid.GridPanel 分页只有上一页,下一页,首页,尾页的选项,如果数据有500页,我要找200页的数据,难道我要点200次? 这样肯定是不行的。


自己加一个直接跳页的按钮该怎么做呢?麻烦大家给个意见!
[解决办法]
貌似有个输入框,输入页数按回车就可以了啊。
[解决办法]
如果是extjs 4的话可以在store里做文章,它有个loadPage() 类可以实现此功能,比如直接loadPage(5) 加载第五页。但是这样做也要在后台也要做相应的设置,要传到前台三个值:当前页,总页数,和当前页起始数据的index. 参见api(http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.Store-method-loadPage)

如果是extjs3 或更低版本无此功能
[解决办法]
extjs3.4 可扩展PagingToolbar加doLoad(n)
以下是参考,与store无关的例子


Ext.PagingToolbarOnly = Ext.extend(Ext.PagingToolbar, {
afterPageText:'',
beforePageText:'',
displayInfo:true,
displayMsg:'显示 {0} - {1} / {2}',
emptyMsg:'暂时没有数据',
firstText:'首页',
prevText:'前页',
nextText:'后页',
lastText:'末页',
refreshText:'刷新',
totalCount:0,
doLoad: function(n){
sURL= "controller.asp?action=list&page_no=" + n + "&page_size=" + this.pageSize + "&f=" + escape(sField)+ "&v=" + escape(sValue);
location.href = sURL + "&" + escape(new Date());
},
updateInfo: function(){
if(this.displayItem){
var count = this.store.getCount();
var msg = count == 0 ?
this.emptyMsg :
String.format(this.displayMsg,this.cursor+1, this.cursor+count, this.store.getTotalCount());
this.displayItem.setText(msg);
}
},
onLoad: function(store, r, o){
if(!this.rendered){
this.dsLoaded = [store, r, o];
return;
}
//if(!o.params
[解决办法]
this.store.getTotalCount() == 0) this.cursor = 0;
if(!o.params
[解决办法]
this.totalCount == 0) this.cursor = 0;
else this.cursor = (o.params[this.getParams().start] - 1) * this.pageSize + 1;
var d =this.getPageData(), ap = d.activePage, ps = d.pages;
this.afterTextItem.setText(String.format(this.afterPageText, d.pages));
this.inputItem.setValue(ap);
this.first.setDisabled(ap == 1
[解决办法]
ps == 0);
this.prev.setDisabled( ap == 1
[解决办法]
ps == 0);
this.next.setDisabled(ap == ps
[解决办法]
ps == 0);
this.last.setDisabled(ap == ps
[解决办法]
ps == 0);
this.refresh.enable();
this.refresh.setDisabled(ps == 0);
this.updateInfo();
},
getPageData: function(){
var total = this.totalCount;//this.store.getTotalCount();
return {


total: total,
activePage: total != 0 && this.cursor == 0 ? 1 : Math.ceil(this.cursor / this.pageSize),
pages: total !=0 && total < this.pageSize ? 1 : Math.ceil(total / this.pageSize)
}
},
moveFirst:function(){
this.doLoad(1);
},
movePrevious:function(){
var d = this.getPageData();
this.doLoad(Math.max(1, parseInt(d.activePage,10) - 1));
},
moveNext:function(){
var d = this.getPageData();
this.doLoad(Math.min(parseInt(d.pages,10), parseInt(d.activePage,10) + 1));
},
moveLast:function(){
var d = this.getPageData();
this.doLoad(parseInt(d.pages,10));
},
doRefresh:function(){
var d = this.getPageData();
this.doLoad(parseInt(d.activePage,10));
},
onPagingKeyDown: function(field,e){
var k = e.getKey();
var d = this.getPageData(), pageNum;
if(k == e.RETURN){
e.stopEvent();
pageNum = this.readPage(d)
if(pageNum >= d.pages){
pageNum = d.pages;
}
else if(pageNum <= 1){
pageNum = 1;
}
this.doLoad(pageNum);
}
else if(k == e.HOME
[解决办法]
k == e.END){
e.stopEvent();
pageNum = k == e.HOME ? 1 : d.pages;
field.setValue(pageNum);
}
else if(k == e.UP
[解决办法]
k == e.PAGEUP
[解决办法]
k == e.DOWN
[解决办法]
k == e.PAGEDOWN){
e.stopEvent();
if(pageNum = this.readPage(d)){
var increment = e.shiftKey ? 10 : 1;
if(k == e.DOWN
[解决办法]
k == e.PAGEDOWN) increment *= -1;
pageNum += increment;
if(pageNum >= 1 & pageNum <= d.pages) field.setValue(pageNum);
}
}
}
});
Ext.reg('pagingtoolbaronly', Ext.PagingToolbarOnly);

读书人网 >JavaScript

热点推荐