当前位置: 代码迷 >> Ajax >> Ext2.0中grid表格分页的有关问题?
  详细解决方案

Ext2.0中grid表格分页的有关问题?

热度:871   发布时间:2012-02-16 21:30:36.0
Ext2.0中grid表格分页的问题???????? - Web 开发 / Ajax
这是我做的一个grid表格分页例子,从一个jsp相应产生数据返回到客户端。可是怎么在客户端都得不到服务器产生的数据,服务器确实也产生了数据。请各位ext前辈帮帮忙看看怎么问题,谢谢啦!

下面是Ext的js代码:

 Ext.onReady(function(){
 
 var sm = new Ext.grid.CheckboxSelectionModel();
 
 var cm = new Ext.grid.ColumnModel([
  new Ext.grid.RowNumberer(),
  sm,
  {header:'编号',dataIndex:'id',sortable:true},
  {header:'名称',dataIndex:'name',sortable:true,renderer:function(value){
   
  if(value=='male'){
  return "<span style='color:red;font-weight:bold;'>红男</span><img src='./img/1.PNG'>";
  }else{
  return "<span style='color:green;font-weight:bold;'>绿女</span><img src='./img/2.PNG'>";
  }
   
  }},
  {header:'性别',dataIndex:'sex',sortable:true},
  {header:'描述',dataIndex:'descn',sortable:true}
  ]);
  cm.defaultSortable = true;
   
// var data = [
// ['1','name1','male','descn1'],
// ['2','name2','female','descn2'],
// ['3','name3','male','descn3'],
// ['4','name4','female','descn4'],
// ['5','name5','male','descn5'],
// ['6','name6','male','descn1'],
// ['7','name7','female','descn2'],
// ['8','name8','male','descn3'],
// ['9','name7','female','descn2'],
// ['10','name8','male','descn3'],
// ['11','name8','male','descn3']
// ];

 var ds = new Ext.data.Store({
  proxy: new Ext.data.HttpProxy({url:'page.jsp'}),
  reader: new Ext.data.JsonReader({
  totalProperty: 'totalProperty',
  root: 'root'
  }, 
  [
  {name: 'id',mapping:'id'},
  {name: 'name',mapping:'name'},
  {name:'sex',mapping:'sex'},
  {name: 'descn',mapping:'descn'}
  ]),
  remoteSort:true
   
  });
   
  var grid = new Ext.grid.GridPanel({
  el: 'grid',
  title:'Ext Grid Test',
  width:450,
  height:410,
  trackMouseOver:false,
  loadMask: {msg:'正在加载数据,请稍侯……'},
  store:ds,
  cm: cm,
  sm:sm,
  bbar: new Ext.PagingToolbar({
  pageSize: 5,
  store: ds,
  displayInfo: true,
  displayMsg: '当前显示 {0} - {1}条记录 /共 {2}条记录',
  emptyMsg: "No topics to display"
  })
});
  
  grid.render();
   
  ds.load({params:{start:0, limit:5}});
   
});

下面的是服务器代码,jsp:

<body>
  <%
  String start = request.getParameter("start");
  String limit = request.getParameter("limit");

int index = Integer.parseInt(start);
  int pageSize = Integer.parseInt(limit);
  String json = "{totalProperty:100,root:[";
  for (int i = index; i < pageSize + index; i++) {
  json += "{id:" + i + ",name:'" + i + ",sex:'sex"+i+"',descn:'descn" + i
  + "'}";
  if (i != pageSize + index - 1) {
  json += ",";
  }
  }
  json += "]}";
  response.getWriter().write(json);
  System.out.print(json);
  %>
 </body>
</html>


  相关解决方案