2011-06-02 132 views
0

我正在做一些調查jqgrid,一切工作正常,直到我加載包含大約1M數據庫中的大量數據,jqgrid現在不顯示,當我縮小數據庫的行數100K,數據將顯示,但我仍然需要多次刷新頁面,我縮小到10K,它工作正常,我不確定jqgrid的大小有限?等等,我可以將數據保存到本地文件,該文件通過url返回,並將其上傳到服務器,並將url更改爲文件,jqgrid可以將其顯示出來。 ?代碼是在這裏:下面Jqgrid巨大的數據加載問題

<script type="text/javascript"> 
      $.jgrid.no_legacy_api = true; 
      $.jgrid.useJSON = true; 
      $(function() { 
       $("#griddisplay").jqGrid({ 
        url:'<spring:url value="/charts/search/sub"/>', 
        datatype: 'json', 
        mtype:'POST', 
        colNames:['id','time_stamp', 'user_name','name','parameter'], 
        colModel:[ 
         {name:'id',index:'id',width:160}, 
         {name:'time_stamp',index:'time_stamp',width:160}, 
         {name:'user_name',index:'user_name',width:160}, 
         {name:'name',index:'name',width:160}, 
         {name:'parameter',index:'parameter', width:100} 
        ],   
        rowNum:100, 
        rowList:[100,50,25], 
        height: 500, 
        autowidth: true, 
        rownumbers: true, 
        pager: '#pager', 
        sortname: 'time_stamp', 
        gridview: true, 
        //viewrecords: true, 
        sortorder: "asc", 
        //emptyrecords: "<fmt:message key='msg.report.table.noreport' />", 
        loadonce: false, 
        //multiselect: false, 
        //loadComplete: function() { 
        //}, 
        //caption: "Video Grid", 
        jsonReader: { 
         repeatitems: false, 
         id: "id", 
         root: "rows", 
         page: "page", 
         total: "total", 
         records: "records" 
        } 
       }); 
      }); 
    </script> 

JSON數據是:

{ 
    "page": 1, 
    "total": 2, 
    "records": 2, 
    "rows": [ 
     { 
      "id": 9901, 
      "time_stamp": "2011-04-12", 
      "user_name": "abcd", 
      "name": "somehere", 
      "parameter": "harry" 
     }, 
     { 
      "id": 9902, 
      "time_stamp": "2011-04-12", 
      "user_name": "abcd", 
      "name": "somehere", 
      "parameter": "harry" 
     } 
    ] 
} 

得到Oracle數據庫中所有的計數

@Transactional(readOnly = true) 
public long getLogbaksRecords() { 
    String sql="select count(*) from test"; 
    long lbs=jdbcTemplate.queryForLong(sql); 
    System.out.println("lbs="+lbs); 
    return lbs; 
} 

獲取數據

@Transactional(readOnly = true) 
public List<LogbakBean> getLogbaks(String sidx, String sord, String rows,int p) { 
    String sql="SELECT * FROM(SELECT A.*, ROWNUM RN FROM (SELECT time_stamp,parameter,user_name,name FROM test order by "+sidx+" "+sord+") A WHERE ROWNUM <= "+p*Integer.valueOf(rows)+")WHERE RN > "+(p-1)*Integer.valueOf(rows); 
    System.out.println("query start"+sql); 
    List<LogbakBean> lbs=jdbcTemplate.query(sql, new RowMapper<LogbakBean>(){ 

     public LogbakBean mapRow(ResultSet rs, int rowNum) 
       throws SQLException { 
      //LOG.info("getLogbaks===mapRow"); 
      LogbakBean lb=new LogbakBean(); 
      SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd"); 
      String time=sdf.format(new Date(Long.valueOf(rs.getString("time_stamp")))); 
      lb.setTime_stamp(time); 
      lb.setParameter(rs.getString("parameter")); 
      lb.setUser_name(rs.getString("user_name")); 
      lb.setName(rs.getString("name")); 
      lb.setId(Long.valueOf(rs.getString("RN"))); 
      //System.out.println("curt rows="+rs.getString(5)); 
      //LOG.info("getLogbaks===mapRow===finish"); 
      return lb; 
     } 

    }); 
    System.out.println("query end"); 
    return lbs; 
} 

網控制器將數據返回給jqgrid

@RequestMapping(value="/charts/search/sub",method=RequestMethod.GET) 
public void searchResult(
     HttpServletRequest request, 
     HttpServletResponse response, 
     @RequestParam("page")String page, 
     @RequestParam("rows")String rows, 
     @RequestParam("sidx")String sidx, 
     @RequestParam("sord")String sord) throws IOException{ 

    int p= Integer.parseInt(page); 
    int t=Integer.parseInt(rows); 
    System.out.println("p="+p+"t="+t); 
    long logs=services.getLogbaksRecords(); 
    JSONObject obj=new JSONObject(); 
    obj.put("page", p); 
    obj.put("total",logs%t==0?logs/t:logs/t+1); 
    obj.put("records",logs); 
    System.out.println("total records="+logs); 
    JSONArray arr=new JSONArray(); 
    List<LogbakBean> lgb=services.getLogbaks(sidx,sord,rows,p); 
    for(int i=0;i<lgb.size();i++){ 
     JSONObject o=new JSONObject(); 
     LogbakBean l=lgb.get(i); 
     o.put("id", l.getId()); 
     o.put("time_stamp", l.getTime_stamp()); 
     o.put("user_name",l.getUser_name()); 
     o.put("name",l.getName()); 
     o.put("parameter",l.getParameter()); 
     arr.add(o); 
     LOG.info(l.getTime_stamp()+","+l.getUser_name()+","+l.getName()+","+l.getParameter()); 
    } 
    obj.put("rows", arr); 
    response.setContentType("text/html;charset=utf-8"); 
    response.getWriter().write(obj.toString()); 
    //OutputFormat format = OutputFormat.createCompactFormat(); 
    //JsonWriter writer = new JsonWriter(); 
    //writer. 
    //return obj; 

} 

回答

2

我想你不應該通過電線傳輸這樣的數據量。
jqGrid使用了一個分頁系統,它允許你將大塊數據返回到網格。

基本上我會做的是實現你的數據服務器端的某種分頁。

+0

是的,我確實在服務器端進行分頁,我一次從1M行數據中的服務器獲取100行,由於數據很大,似乎返回的數據有點慢,即使通過我將數據減小到只有一個排,jqgrid也不顯示。任何意見? – Victor 2011-06-02 09:43:09

+0

@Victor:我認爲問題在服務器端。您的服務器太忙,無法讀取1M行,jqGrid正在等待。 – LeftyX 2011-06-02 09:58:20

+1

@Victor:我認爲LeftyX是對的。我還假設你應該驗證你用於分頁數據的代碼。哪個SELECT語句將被執行?服務器代碼花了多少時間?你擁有哪個數據庫(MS SQL SERVER,MySQL,...)? jqGrid只是使用來自JSON服務器響應中'page','total'和'records'的值。無論服務器數據庫中是否有200或2000000行,它都是不重要的。無論如何,如果你使用'jsonReader:{cell:「」,id:「0」}和相應的JSON數據,你可以減少兩次數據的大小。此外,我會使用'rowNum:25' – Oleg 2011-06-02 10:23:41

0

最後,問題解決了,只是因爲我在網格頁面使用多選,multiselect與jqgrid衝突,請參閱上面我更新的代碼。坦克奧列格和leftyX

衝突代碼如下

$(function(){ 
    $.localise('ui-multiselect', {/*language: 'zh',*/ path: '<spring:url value="/resources/scripts/multiselect/" />'}); 
    $(".multiselect").multiselect(); 
}); 

當我刪除了代碼,解決了問題。感謝大家。