Extjs4中的分頁應(yīng)用結(jié)合前后臺(tái)
更新時(shí)間:2013年12月13日 15:35:54 作者:
本文為大家介紹下Extjs4中的分頁如何使用且結(jié)合前后臺(tái),具體的示例如下,感興趣的朋友可以參考下
前臺(tái)部分:
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'// 默認(rèn)ASC
}],
autoLoad:{start: 0, limit: 4}//start是從第幾條開始,limit是每頁的條數(shù)
});
store.loadPage(1); //加載第一頁
后臺(tái)部分:
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();
}
}
復(fù)制代碼 代碼如下:
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'// 默認(rèn)ASC
}],
autoLoad:{start: 0, limit: 4}//start是從第幾條開始,limit是每頁的條數(shù)
});
store.loadPage(1); //加載第一頁
后臺(tái)部分:
復(fù)制代碼 代碼如下:
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)文章
ANT 壓縮(去掉空格/注釋)JS文件可提高js運(yùn)行速度
在解決這個(gè)有很多優(yōu)化方法,今天來說其中一種,那就是在Ant腳本打包的時(shí)候,把js中空格、注釋去掉、以及合并,合并今天不說了,還未實(shí)現(xiàn)這個(gè),在研究中2013-04-04
ExtJS Grid使用SimpleStore、多選框的方法
ExtJS 中Grid使用SimpleStore、多選框的方法,需要的朋友可以參考下。2009-11-11
ExtJs 實(shí)現(xiàn)動(dòng)態(tài)加載grid完整示例
動(dòng)態(tài)加載grid在ExtJs中如何實(shí)現(xiàn),貌似有很多的朋友都不知道吧,下面有個(gè)不錯(cuò)的示例,希望對(duì)大家有所幫助2013-09-09
extjs3 combobox取value和text案例詳解
使用combobox時(shí),它有一個(gè)hiddenName的屬性,專門用于提交combobox中value的值,接下來介紹extjs3 combobox如何取value和text值,感興趣的朋友可以不要錯(cuò)過了啊2013-02-02
Extjs gridpanel 出現(xiàn)橫向滾動(dòng)條問題的解決方法
Extjs gridpanel 出現(xiàn)橫向滾動(dòng)條問題的解決方法,在gridpanel中加入以下代碼即可。2011-07-07
Extjs中DisplayField的日期或者數(shù)字格式化擴(kuò)展
在用Extjs的時(shí)候,有時(shí)需要對(duì) Ext.form.DisplyField 進(jìn)行格式化。2010-09-09
Extjs 繼承Ext.data.Store不起作用原因分析及解決
有關(guān)Extjs 繼承Ext.data.Store 不起作用的原因有很多種,接下來與大家分享下,本人遇到的,這個(gè)Store寫出來之后 是不會(huì)起到作用的,感興趣的朋友可以看下詳細(xì)的原因及解決方法2013-04-04
Extjs Ext.MessageBox.confirm 確認(rèn)對(duì)話框詳解
顯示一個(gè)確認(rèn)對(duì)話框,用來代替JavaScript標(biāo)準(zhǔn)的confirm()方法,具有兩個(gè)按鈕“是”和“否”如果為其提供一個(gè)回調(diào)函數(shù),則該函數(shù)將在單擊按鈕后被調(diào)用(包括右上角的推出按鈕),所單擊按鈕的id將被作為唯一的參數(shù)傳遞到回調(diào)函數(shù)中。2010-04-04
ExtJS 2.0實(shí)用簡明教程 之ExtJS版的Hello
下面我們寫一個(gè)最簡單的ExtJS應(yīng)用,在hello.html文件中輸入下面的代碼2009-04-04

