Extjs4中的分頁應用程式結合前後台_extjs

前台部分：

複製程式碼 程式碼如下:

Ext.define('GS.system. role.store.RoleGridStore',{
extend:'Ext.data.Store',
model:'GS.system.role.model.RoleGridModel',
id:'roleStoreId',
pageSize:4,//分頁大小
proxy:{
type:'ajax',
url:'/gs_erp/roleAction!getRoleList',
reader: {
type: 'json ',
root: 'rows',
totalProperty: 'total'
}
},
sorters: [{
property: 'id', //排序欄位
direction: 'asc'// 預設ASC
}],
autoLoad:{start: 0, limit: 4}//start是從第幾條開始，limit是每頁的條數
});

store.loadPage(1); //載入第一頁
後台部分：

複製程式碼

複製程式碼

複製程式碼



複製程式碼



複製程式碼


程式碼如下:


private int limit;//每一頁的條數
private int start;//從哪一條資料開始檢查
private int total;//總條數
/**
* 找所有角色
*/
public void getRoleList()
{

List roleList=new ArrayList() ;
StringBuffer toJson=new StringBuffer();//用來放json資料
System.out.println(start "," limit "," total);
try
{
roleList=(List) pageServiceImpl.commonPagination(Role.class, "", start, limit);
total=pageServiceImpl.getTotalNum(Role.class, "");
toJson.append("{ total:").append("" total "").append(",success:true,").append("start:")
.append("" start "").append("," );
toJson.append("rows:[");
for(int i=0;i{
toJson.append("{id :").append("'").append("" roleList.get(i).getId() "").append("'")
.append(",name:").append( "'").append("" roleList.get(i).getName() "")
.append("'").append(",desc:").append("'").append ("" roleList.get(i).getDesc() "")
.append("'").append("}");
if(i{
toJson.append(",");
}
}
toJson.append("]}");
} catch (Exception e1)
{

// TODO Auto-generated catch block e1.printStackTrace(); } try { response.setHeader("Cache-Control", "no-cache") ; response.setContentType("text/json;charset=utf-8"); response.getWriter().print(toJson); System.out.println(toJson); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } }