Extjs4中的分頁應用結(jié)合前后臺
更新時間:2013年12月13日 15:35:54 作者:
本文為大家介紹下Extjs4中的分頁如何使用且結(jié)合前后臺,具體的示例如下,感興趣的朋友可以參考下
前臺部分:
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是每頁的條數(shù)
});
store.loadPage(1); //加載第一頁
后臺部分:
private int limit;//每一頁的條數(shù)
private int start;//從哪一條數(shù)據(jù)開始查
private int total;//總條數(shù)
/**
* 查找所有角色
*/
public void getRoleList()
{
List<Role> roleList=new ArrayList<Role>();
StringBuffer toJson=new StringBuffer();//用來放json數(shù)據(jù)
System.out.println(start+","+limit+","+total);
try
{
roleList=(List<Role>) 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<roleList.size();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<roleList.size()-1)
{
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();
}
}
復制代碼 代碼如下:
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是每頁的條數(shù)
});
store.loadPage(1); //加載第一頁
后臺部分:
復制代碼 代碼如下:
private int limit;//每一頁的條數(shù)
private int start;//從哪一條數(shù)據(jù)開始查
private int total;//總條數(shù)
/**
* 查找所有角色
*/
public void getRoleList()
{
List<Role> roleList=new ArrayList<Role>();
StringBuffer toJson=new StringBuffer();//用來放json數(shù)據(jù)
System.out.println(start+","+limit+","+total);
try
{
roleList=(List<Role>) 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<roleList.size();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<roleList.size()-1)
{
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();
}
}
相關(guān)文章
Extjs 繼承Ext.data.Store不起作用原因分析及解決
有關(guān)Extjs 繼承Ext.data.Store 不起作用的原因有很多種,接下來與大家分享下,本人遇到的,這個Store寫出來之后 是不會起到作用的,感興趣的朋友可以看下詳細的原因及解決方法2013-04-04
Ext4.2的Ext.grid.plugin.RowExpander無法觸發(fā)事件解決辦法
這篇文章主要介紹了Ext4.2的Ext.grid.plugin.RowExpander無法觸發(fā)事件解決辦法,本文中的事件指collapsebody和expandbody事件,需要的朋友可以參考下2014-08-08
ExtJS4 Grid改變單元格背景顏色及Column render學習
利用的是Column的render實現(xiàn)單元格背景顏色改變,本文給予了實現(xiàn)代碼,感興趣的朋友可以了解下,或許對你學習ExtJS4 Grid有所幫助2013-02-02
ext前臺接收action傳過來的json數(shù)據(jù)示例
這篇文章以示例的方式為大家介紹了ext前臺接收action傳過來的json數(shù)據(jù),需要的朋友可以參考下2014-06-06
ExtJs3.0中Store添加 baseParams 的Bug
今天發(fā)現(xiàn)了一個ExtJS3.0中的Bug 以前用2.0的時候,喜歡這樣增加參數(shù)2010-03-03

