EasyUi datagrid melaksanakan paging_jquery jadual-tutorial js-php.cn

EasyUi datagrid melaksanakan paging_jquery jadual

WBOY

Lepaskan： 2016-05-16 16:14:46

asal

1205 orang telah melayarinya

1. Mula-mula perkenalkan fail css dan js easyui

2. Js yang perlu ditulis di meja hadapan

Salin kod Kod adalah seperti berikut:

//Data sumber
fungsi Async(action,args,callback){
$.ajax({
url: tindakan ,
taip:"POST",
dataType:"json",
Tamat masa: 10000,
data: args,
Kejayaan: fungsi(data){
jika(panggilan balik){
panggil balik(data);
}
}
});
}
//Ikat data dan tetapkan halaman
fungsi BingData(pid,args,action,callback){
Async(tindakan,args,fungsi(data){
if(data!=null&&data.list!=null){
var _dataCount=data.size;//Jumlah bilangan item
var _data=data.list;//data
jika(panggilan balik){
panggil balik(_data);
}
$(pid).datagrid('loadData', _data);
$(pid).datagrid('getPager').penomboran({
beforePageTeks: 'th',
afterPageText: 'Halaman {halaman}',
displayMsg: 'Pada masa ini memaparkan {dari} - {kepada} rekod, sejumlah {total} rekod',
pageSize: args.pageSize,
jumlah: _dataCount,
pageNombor: args.pageIndex,
pageList:args.pageList,
onSelectPage: fungsi (Nombor halaman, Saiz halaman) {
args.pageIndex = pageNumber;
args.pageSize = pageSize;
BingData(pid, args, action,null);
},
onRefresh: fungsi (Nombor halaman, Saiz halaman) {
args.pageIndex = pageNumber;
args.pageSize = pageSize;
BingData(pid, args, action,null);
}
});
}
});
}
//Sirikan borang menjadi objek
$.fn.serializeObject = function(){
var obj = {};
$.each( this.serializeArray(), function(i,o){
var n = o.name, v = o.value;
obj[n] = obj[n] === tidak ditakrifkan v
: $.isArray( obj[n] ) ? : [ obj[n], v ];
});
kembalikan JSON.stringify(obj);
};
//Lebar
fungsi fixWidth(peratus){
pulangkan document.body.clientWidth * peratus ;
}
//Tamatkan pengeditan
fungsi endEdit(vid){
vid = "#" vid;
var tb=$(vid);
var rows = tb.datagrid('getRows');
untuk ( var i = 0; i < rows.length; i ) {
tb.datagrid('endEdit', i);
}
}
fungsi GetData(obj){
var url = contextPath '/fundRetreatVoucher/fundBatchRetreatVoucherQuery.htm';//action path
var args={};
args.pageIndex=1;//Indeks halaman
args.pageSize=10;//Kapasiti halaman
if(obj!=null){ //Bentuk objek bersiri
args.obj=obj;
}
BingData("#tab",args,url,null);
}
fungsi getTab(){
GetData();
var tb=$('#tab');
tb.datagrid({
tajuk: 'Hasil pertanyaan kumpulan pemulangan dana',
belang: benar,
fitColumns: benar, //Saiz lajur penyesuaian
nombor baris: benar,
nowrap: true, //Tetapkan kepada benar, apabila panjang data melebihi lebar lajur, ia akan dipintas secara automatik
belang: benar,
width:fixWidth(0.99),
ketinggian:'430',
singleSelect:true,
loadMsg: 'Pemuatan data...',
lajur:[[
{field:'interfaceInfoCode',title:'Fund Channel Code',width:fixWidth(0.3),align: "center"},
{field:'retreatBatchCode',title:'Funds return batch number',width:fixWidth(0.2),editor:'text',align: "center"},
{field:'totalMoney',title:'total amount',width:fixWidth(0.1),align:'right',editor:'text',align: "center"},
{field:'def2',title:'Operation',width:fixWidth(0.3),editor:'text',align:'right',align: "center",
formatter:function(nilai,baris,indeks){
　　var vcode =row.retreatBatchCode;
　　var e = 'Butiran 　　var d = 'Audit lulus 　　var f = 'Penolakan audit 　　kembali e d f;
　　}}
]],
onLoadSuccess:function(data){
jika (data.total == 0) {
}
},
Penomboran: benar,
pageIndex:1,//Indeks halaman
Saiz halaman:10,//Kapasiti halaman
Senarai halaman: [10,15,20]
})
}

2 Belakang pentas

Salin kod Kod adalah seperti berikut:

int currentPage = request.getParameter("pageIndex") == null 1 : Integer.parseInt(request.getParameter("pageIndex"));

//Bilangan baris setiap halaman

int showCount = request.getParameter("pageSize") == null 10 : Integer.parseInt(request.getParameter("pageSize"));

// Entiti penomboran

String obj = request.getParameter("obj");

jika (StringUtils.notBlank(obj)) {

fundRetreatVoucher = JsonUtils.toObject(obj, FundRetreatVoucherParam.class); //Tukarkan objek json bersiri kepada entiti

}

keluar = response.getWriter();

Senaraikan frvs = fundRetreatVoucherService.findAllFundRetreatVoucher(halaman, fundRetreatVoucher);

int jumlah = fundRetreatVoucherService.findAllFundRetreatVoucher(getTotal(), fundRetreatVoucher).size();//data size

JSONObject json = new JSONObject();

json.put("list", frvs);//Data, kunci put di sini mestilah senarai. Jika ia ditukar, anda perlu menukar data dalam BingData

json.put("saiz", jumlah);

out.print(json);