由于数据量不多,大概3,40条,不分页又太长了,又不想服务器分页(很多东西写死了不好改),琢磨了一下怎么本地分页,还是没搞出来,请大家指点一下,我是用store的loadData把数据载入,PagingToolbar读到了数据,但是无法分页,也想不出来该怎么改了
[code="js"]
cxtjFormPanel = Ext.extend(Ext.form.FormPanel,{
constructor:function(){
this.addEvents("query");
this.addEvents("reset");
cxtjFormPanel.superclass.constructor.call(this,{
autoHeight:true,
baseCls:"x-plain",
layout:"column",
width:550,
labelWidth:80,
items:[
{
columnWidth:.5,
defaults:{width:160},
defaultType:"textfield",
bodyStyle:"padding:5px",
layout:"form",
items:[
{
fieldLabel:"案件登记序号",
name:"ajdjXh",
maxLength:14
},{
fieldLabel:"纳税人编码",
name:"nsrbm",
maxLength:20
}
]
},{
columnWidth:.5,
defaults:{width:160},
defaultType:"textfield",
bodyStyle:"padding:5px",
layout:"form",
items:[
{
fieldLabel:"案源登记序号",
name:"aydjXh",
maxLength:14
},{
fieldLabel:"纳税人名称",
name:"nsrmc"
}
]
}
],
buttons:[
{
text:"查询",
handler:function(){
try{
this.onQuery();
}catch(e){
return;
}
},
scope:this
},{
text:"清空",
handler:function(){
this.onReset();
},
scope:this
}
]
});
},
onQuery:function(){
if(this.getForm().isValid())
this.fireEvent("query",this.getForm());
else
throw Error();
},
onReset:function(){
this.fireEvent("reset",this.getForm());
}
});
ajxxGridPanel = Ext.extend(Ext.grid.GridPanel,{
data:null,
constructor:function(){
this.addEvents("delete");
this.data = new Ext.data.JsonStore({
fields:["ajdjxh","aydjxh","nsrmc","ajmc","ajzt"]
}),
ajxxGridPanel.superclass.constructor.call(this,{
title:"案件信息列表",
autoHeight:true,
frame:true,
width:660,
loadMask:{msg:"正在加载,请稍后..."},
tbar:[
{
text:"删除案件",
handler:function(){
try{
this.onDelete();
}catch(e){
Ext.Msg.alert("提示","请选择要删除的案件!");
return;
}
},
scope:this
},"-"
],
columns:[
new Ext.grid.CheckboxSelectionModel(),
{header:"案件编号",dataIndex:"ajdjxh",width:100},
{header:"案源编号",dataIndex:"aydjxh",width:100},
{header:"纳税人名称",dataIndex:"nsrmc",width:170},
{header:"案件名称",dataIndex:"ajmc",width:170},
{header:"案件状态",dataIndex:"ajzt",width:110}
],
store:this.data,
// bbar: new Ext.PagingToolbar({
// pageSize: 10,
// store:this.data,
// displayInfo: true,
// displayMsg: '第{0} 到 {1} 条数据 共{2}条',
// emptyMsg: "没有数据"
// }),
sm:new Ext.grid.RowSelectionModel({
singleSelect:true
})
});
},
loadData:function(_data){
this.getStore().loadData(_data,false);
},
onDelete:function(){
if(this.getSelectionModel().getCount()>0)
this.fireEvent("delete",this,this.getStore(),this.getSelectionModel().getSelected());
else
throw Error();
}
});
ViewPanel = Ext.extend(Ext.Panel,{
form:null,
grid:null,
constructor:function(){
this.form = new cxtjFormPanel();
this.grid = new ajxxGridPanel();
ViewPanel.superclass.constructor.call(this,{
title:"删除案件信息",
plain:true,
frame:true,
autoHeight:true,
//height:450,
items:[
this.form,
this.grid
]
});
}
});
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.TextField.prototype.msgTarget = "side";
var _view = new ViewPanel();
_view.render(Ext.getBody());
_view.form.on("query",function(_form){
//_form["waitMsgTarget"] = this.getEl();
_form.submit({
url:"/qt/qt036JcScajxxExt-query.pfv",
waitMsg:"正在查询,请稍后...",
success:function(_f,_a){
this.grid.loadData(_a.result.data);
},
failure:function(_f,_a){
Ext.Msg.alert("错误","查询失败!");
},
scope:this
});
},_view);
_view.form.on("reset",function(_form){
_form.reset();
},_view);
_view.grid.on("delete",function(_grid,_store,_record){
Ext.Msg.confirm("提示","是否删除案件["+_record.data.ajmc+"]?",function(_btn){
if(_btn=="yes"){
this.grid.getEl().mask("正在删除,请稍后...");
Ext.Ajax.request({
url:"/qt/qt036JcScajxxExt-delete.pfv",
params:{ajdjXh:_record.data.ajdjxh,aydjXh:_record.data.aydjxh},
success:function(_response){
var _result = Ext.util.JSON.decode(_response.responseText);
if(_result.state == "info"){
_store.remove(_record);
}
Ext.Msg.alert("提示",_result.message);
this.grid.getEl().unmask();
},
failure:function(){
Ext.Msg.alert("错误","删除案件失败!");
this.grid.getEl().unmask();
},
scope:this
});
}
},this)
},_view);
});
[/code]
找个PagingMemoryProxy
把PagingMemoryProxy.js从examples/locale/目录下copy过来,导入html里:
把以前的MemoryProxy换成PagingMemoryProxy。
var ds = new Ext.data.Store({
proxy: new Ext.data.PagingMemoryProxy(data),
reader: new Ext.data.ArrayReader({}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
好了,现在直接调用ds.load({params:{start:0,limit:3}})
PangingMemoryProxy.js
[code="js"]
/*
/* Fix for Opera, which does not seem to include the map function on Array's */
if(!Array.prototype.map){
Array.prototype.map = function(fun){
var len = this.length;
if(typeof fun != "function"){
throw new TypeError();
}
var res = new Array(len);
var thisp = arguments[1];
for(var i = 0; i < len; i++){
if(i in this){
res[i] = fun.call(thisp, this[i], i, this);
}
}
return res;
};
}
/* Paging Memory Proxy, allows to use paging grid with in memory dataset */
Ext.data.PagingMemoryProxy = function(data) {
Ext.data.PagingMemoryProxy.superclass.constructor.call(this);
this.data = data;
};
Ext.extend(Ext.data.PagingMemoryProxy, Ext.data.MemoryProxy, {
load : function(params, reader, callback, scope, arg) {
params = params || {};
var result;
try {
result = reader.readRecords(this.data);
}catch(e){
this.fireEvent("loadexception", this, arg, null, e);
callback.call(scope, null, arg, false);
return;
}
// filtering
if (params.filter!==undefined) {
result.records = result.records.filter(function(el){
if (typeof(el)=="object"){
var att = params.filterCol || 0;
return String(el.data[att]).match(params.filter)?true:false;
} else {
return String(el).match(params.filter)?true:false;
}
});
result.totalRecords = result.records.length;
}
// sorting
if (params.sort!==undefined) {
// use integer as params.sort to specify column, since arrays are not named
// params.sort=0; would also match a array without columns
var dir = String(params.dir).toUpperCase() == "DESC" ? -1 : 1;
var fn = function(r1, r2){
return r1 < r2;
};
result.records.sort(function(a, b) {
var v = 0;
if (typeof(a)=="object"){
v = fn(a.data[params.sort], b.data[params.sort]) * dir;
} else {
v = fn(a, b) * dir;
}
if (v==0) {
v = (a.index < b.index ? -1 : 1);
}
return v;
});
}
// paging (use undefined cause start can also be 0 (thus false))
if (params.start!==undefined && params.limit!==undefined) {
result.records = result.records.slice(params.start, params.start+params.limit);
}
callback.call(scope, result, arg, true);
}
});
[/code]
楼主 有了答案,请告诉我,我也这样问题。。。谢谢