溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
頁面是用的純css的效果，沒有使用bootstrap的框架，不然自帶的分頁是挺好用的，就不用麻煩了這邊使用了jquery pagination分頁插件來實現這個功能的，這邊后臺用的是struts2的框架，ssh的，jquery返回json數據，然后循環拼接table輸入到頁面，這個分頁插件使用起來感覺還是比較簡單，代碼編輯比較少，也有樣式可以選擇，但是那樣要導入pagination.css在div中的class修改樣式不導入的話就只有默認樣式，這邊樣式也沒有調節，不是很美觀，功能實現了，干貨：
效果圖：
jsp：
<script src="<%=basePath %>bootstrap/js/jquery.pagination.js"></script> <div id="Pagination" class="pagination" text-align="right"><!-- 這里顯示分頁 --></div>
js：
var pageIndex = -1; //頁面索引初始值
var pageSize = 5; //每頁顯示條數初始化，修改顯示條數，修改這里即可
var pageCount = 0; //每頁顯示條數初始化，修改顯示條數，修改這里即可
InitTable(pageIndex); //Load事件，初始化表格數據，頁面索引為0（第一頁）
//分頁，PageCount是總條目數，這是必選參數，其它參數都是可選
//翻頁調用
function PageCallback(index, jq) {
InitTable(index);
}
//請求數據
function InitTable(pi) {
var sendpn = 0;
if(pi!=-1){
sendpn = pi;
}
$.ajax({
type: "POST",
dataType: "json",
url: 'findEquipmentInfo.action', //提交到一般處理程序請求數據
data: {pageNo:sendpn,pageSize:pageSize}, //提交兩個參數：pageIndex(頁面索引)，pageSize(顯示條數)
success: function(data) {
var tabletr='';
$(data.root).each(function(i,obj){
tabletr=tabletr+"<tr><td><input type='checkbox' class='checkboxAll' value='"+obj.id+"'/></td><td>"+obj.deviceName+"</td>"+"<td>"+obj.deviceIP+"</td>"+"<td>"+obj.companyName+"</td>"+"<td>"+obj.deviceSN+"</td>"+"<td>"+obj.devicePN+"</td>"+"<td>"+obj.inTime+"</td>"+"<td>"+obj.warrantyTime+"</td>"+"</tr>";
});
$("#tablepos_tbody").html(tabletr);
pageCount = data.total;
if(pageIndex==-1){
pageIndex=0;
$("#Pagination").pagination(pageCount, {
callback: PageCallback, //PageCallback() 為翻頁調用次函數。
prev_text: "« 上一頁",
next_text: "下一頁 »",
items_per_page:pageSize,
num_edge_entries: 2, //兩側首尾分頁條目數
num_display_entries: 6, //連續分頁主體部分分頁條目數
current_page: pageIndex, //當前頁索引
});
}
}
});
}
action：
private int rowCount=0;
private int pageNo=1;
private int pageSize=10;
private int pageCount=0;
private String result;
public int getRowCount() {
return rowCount;
}
public void setRowCount(int rowCount) {
this.rowCount = rowCount;
}
public int getPageNo() {
return pageNo;
}
public void setPageNo(int pageNo) {
this.pageNo = pageNo;
}
public int getPageSize() {
return pageSize;
}
public void setPageSize(int pageSize) {
this.pageSize = pageSize;
}
public int getPageCount() {
return pageCount;
}
public void setPageCount(int pageCount) {
this.pageCount = pageCount;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
public String findEquipmentInfo(){
Page page =new Page();
page.setStart(pageSize*pageNo);
page.setLimit((pageNo+1)*pageSize);
page.setTotalCount(service.rowCount());
List list=service.allperson(pageNo, pageSize);
System.out.println(pageNo+" "+pageSize );
this.setJsonStr(listToGridJoson(page, list));
return SUCCESS;
}
home：
int rowCount=0;
public int rowCount(){
String sql = "select count(*) from EQUIPMENT_INFO";
Query query = sessionFactory.getCurrentSession().createSQLQuery(sql.toString());
int rowCount = Integer.parseInt(query.uniqueResult().toString());
return rowCount;
}
public List allperson(int pageNo,int pageSize){
System.out.println(pageNo);
List list=this.all(pageNo, pageSize);
return list;
}
public List all(int pageNo,int pageSize){
String sql = "from EquipmentInfo ";
Query query = sessionFactory.getCurrentSession().createQuery(sql.toString());
query.setFirstResult(pageSize*pageNo);
query.setMaxResults(pageSize);
List list = query.list();
return list;
}
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
