我想将extjs表格中的分页工具栏的功能改变,就是页的总数是后台给的,当点解下一页时是向后台请求数据

后台将请求的数据返回给前台的表格中。
2024-12-01 04:32:31
推荐回答(1个)
回答1:

var gridcl;
function operatorActioncl(value, cellmeta, record, rowIndex, store) {
// value是当前值,
// record是当前行
// store是当前表
// rowIndex是当前列
var needId=record.get('platenum');
var cngtypename=record.get('cngtypename');
var str = " ";
str += "修改加气属性  ";
return str;
}

// 载入方法
function clload(divid) {
var store=getstore();
// 复选框
var sm = new Ext.grid.CheckboxSelectionModel( {
checkOnly : false,
singleSelect : true,
listeners: {
rowselect: function(sm, row, rec) {
inputForm(rec);
}
},
hidden:true
});
var cm = new Ext.grid.ColumnModel([sm,
{
header : '车辆号牌',
dataIndex : 'platenum',
sortable : true
},{
header : '车主姓名',
dataIndex : 'owner',
hidden:true,
sortable : true
},{
header : '车辆出厂日期',
dataIndex : 'madedate',
renderer:strToDate,
sortable : true
},{
header : '车辆类型',
dataIndex : 'cartypename',
//renderer:isorigAction,
sortable : true
},{
header : '登记单位',
dataIndex : 'unitname',
width:140,
sortable : true
},{
header : '加气属性',
dataIndex : 'cngtypename',
width:50,
sortable : true
}]);

// 构造表格
gridcl = new Ext.grid.GridPanel( {
renderTo : divid,
store : store,
cm : cm,
sm : sm,
width:Ext.get(divid).getWidth(),
height : 300,
title:'车辆信息列表',
stripeRows : true,
bbar : new Ext.PagingToolbar( {
pageSize : 10,
store : store,
displayInfo : true,
displayMsg : '显示第{0}条到{1}条记录,一共{2}条',
emptyMsg : "没有记录"
}),
//title : '信息列表',
viewConfig : {
columnsText : '显示的列',
forceFit : true
}
});

}

//加载带条件
function getstore(){
var store = new Ext.data.Store( {
// 解析数据获取路径
proxy : new Ext.data.HttpProxy( {
url : apsvr_url,//请求后台的url
method : 'POST'
}),
// 每次传输的基本参数,传递json方式-------这里你可以不传
baseParams : {
"opname" : "paging",
"opobject" : "carview",
"fieldjson" : '{"platenum":"","madedate":"","cngtypename":"","owner":"","unitname":"","cartypename":"","cngtypeid":""}',
"wherejson" : "{}"
},
// 转化器,转换成store能读取的内容
reader : new Ext.data.JsonReader( {
totalProperty : 'result',// 总条数,前面是组件必须的,后面是你对应传的
root : 'content'// 数据源ID
},
// 这里定义需要数据
[ {
name : 'platenum'
},{
name : 'madedate'
}, {
name : 'cngtypename'
},{
name : 'owner'
},{
name : 'unitname'
},{
name : 'cartypename'
},{
name : 'cngtypeid'
}])
});
var str = '{}';
// 设置查询传递参数
store.baseParams.wherejson = str;
store.load( {
params : {
start : 0,
limit : 10
}
});
return store;

}

// 批量数据方法
function clarrAction() {
// 通过sm选中行拿到所有的行参数
var arr = gridcl.getSelectionModel().getSelections();

}

// 查询方法
function clselectMethod(plateNum,unitId,checkdate) {
var parray=new Array();
if(plateNum !=""){
parray.push('"platenum":'+'"' + plateNum + '"')
}
if(unitId != ""){
parray.push('"unitid":'+'"' + unitId + '"')
}
if(checkdate != ""){
parray.push('"madedate":'+checkdate)
}

var str = "{"+parray.join(",")+"}";
gridcl.getStore().baseParams.wherejson = str;
gridcl.getStore().load( {
params : {
start : 0,
limit : 10
}
});
}

//重新载入数据
function reflushTab(){
gridcl.getStore().reload();
/*gridcl.getStore().load( {
params : {
start : 0,
limit : 10
}
});*/
}

// 全选
function clselectAlldatas() {
if (gridcl.getSelectionModel() != null) {
gridcl.getSelectionModel().selectAll();
}
}

// 全部取消
function clselectClean() {
if (gridcl.getSelectionModel() != null) {
gridcl.getSelectionModel().clearSelections();
}
}