grid分页

最近一直学习Ext，关于gird分页也困扰了我好久，而且网上找了很多资料，现总结一下：

1、js中定义的store

  
     var Store = new Ext.data.Store({
  proxy:new Ext.data.HttpProxy({url: 后台操作的servlet}),
  reader:new Ext.data.JsonReader({
   totalProperty: 'totalProperty',
            root: 'root'
  },
  ['id','text','name']
  )
 }); 
/
 /**
  * 分页工具
  */
 
     var pagingBar = new Ext.PagingToolbar({
        pageSize: 4,
        store: Store,
        displayInfo: true,
        displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
        emptyMsg: "没有记录"
    }); 
      
/
     var ResultsGridForm = new Ext.FormPanel({
       
        frame: true,
        labelAlign: 'left',
        bodyStyle:'padding:0px',
        width: '100%',
        layout: 'column', // Specifies that the items will now be arranged in columns
        items: [{
            columnWidth: 1,
            layout: 'fit',
            items: {
             id: 'Grid',
             xtype: 'grid',
             store: Store,
             cm: colModel,
             sm:sm,
             height: 260,
             title:'查询结果',
             border: true,
          listeners: {
           render: function(g) {
//            g.getSelectionModel().selectRow(0);//默认选中第一行
           },
           rowdblclick: function(g){//行双击事件
            var row = g.getSelectionModel().getSelected();//获得当前行的信息

           },
           delay:10 // Allow rows to be rendered.
          }
          ,  
   bbar: pagingBar//增加分页工具条
         }
        }],
        renderTo: bd
    });
    
     Store.load({params:{start:0, limit:4}});//传递显示的参数

2 、后台servlet

Integer start = Integer.parseInt(request.getParameter("start"))+1;
   Integer limit = Integer.parseInt(request.getParameter("limit"));
   Integer end = start + limit;

   request.setAttribute("counts", 需要调用的函数，返回总记录数); 
    request.setAttribute("queryListPage", 调用的函数，含分页算法，并且根据传入的参数 start, end分页));

 

3、json 文件为:

<c:set var="len" value="${fn:length(queryListPage)-1}" ></c:set>
{totalProperty:${fn:length(counts)},root:[
<c:forEach items="${queryListPage}" var="ob" varStatus="i">
{
 
 id:'${ob.id}', 
 text:'${ob.description}',
 name:'${ob.name}'
}
 <c:if test="${i.index<len}">,</c:if>
</c:forEach>
]}