datagrid加载的数据来源于页面设置的值，实现分页

问题场景描述：

datagrid的显示数据，不是通过url获取的，而是直接loadData（数据在页面定义的），想实现分页

适用环境：

EOS Platform7.2带的NUI

解决经验：

参考如下页面代码：

<%@ page language="java" contentType="text/html; charset=UTF-8"
 pageEncoding="UTF-8" session="false" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<!-- 
  - Author(s): Administrator
  - Date: 2015-04-23 10:26:17
  - Description:
-->
<head>
<title>Title</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <script src="<%= request.getContextPath() %>/common/nui/nui.js" type="text/javascript"></script>
    
</head>
<body>
    <div id="grid1" class="nui-datagrid" dataField="data" onload="onLoad" pageSize="2">
   <div property="columns">
     <div field="id" width="" headerAlign="" allowSort="true">id
     </div>
     <div field="text" width="" headerAlign="" allowSort="true">text
     </div>
   </div>
 </div>
 <script type="text/javascript">
  mini_debugger = false;   //去掉当load失败时的alert提示
  
  var data = [{'id':'1','text':'aaa'},{'id':'2','text':'bbb'},{'id':'3','text':'bbb'},{'id':'4','text':'bbb'},{'id':'5','text':'bbb'},{'id':'6','text':'bbb'},{'id':'7','text':'bbb'},{'id':'8','text':'bbb'},{'id':'9','text':'bbb'},{'id':'11','text':'bbb'},{'id':'12','text':'bbb'}];
  
     nui.parse();
     
     var grid1 = nui.get("grid1");
     grid1.load();
     
     function onLoad(e){
      var pageIndex = e.pageIndex;
      var pageSize = e.pageSize;
      var pageData = [];
      for(var i = 0; i < pageSize; i++){
       if(pageIndex*pageSize+i < data.length){
        pageData.push(data[pageIndex*pageSize+i]);
       }
      }
      grid1.setData(pageData);
      grid1.setTotalCount(data.length);
     }
     
    </script>
</body>
</html>

注意事项：

无

空间快捷链接

页面树结构

问题场景描述：

适用环境：

解决经验：

注意事项：