2011-06-18 120 views
1

我正在使用jqGrid。分頁沒有得到反映,可能是什麼問題?我檢查了Firefox 4.1和IE8,但並未在Chrome上顯示jqGrid。jqGrid分頁問題

var filesystem=[]; 
$(xml).find('file').each(function(){ 
    var row={}; 
    row.total=$(this).attr('total'); 
    row.free=$(this).attr('free'); 
    row.used=$(this).attr('used'); 
    row.percentage=$(this).attr('percentage'); 
    filesystem.push(row); 
}); 


$('#detailTable').empty(); 
$('<div>') 
.attr('id','diskUsageSpan') 
.html('<div class="titleBlue">Configuration&gt;System&gt;Disk Usage</div>'+ 
     '<table id="list1"></table>'+ 
     '<div id="gridpager"></div>'+ 
    '</div>')   
.appendTo('#detailTable');  

更新

jQuery("#list1").jqGrid({ 
    datatype: "clientSide", 
    height: 250, 
     colNames:['id','Total Space','Free Space', 'Used Space', 'Used Percentage'], 
     colModel:[ 
      {name:'id',index:'id', width:90, align:"right"}, 
      {name:'total',index:'total', width:90, align:"right"}, 
      {name:'free',index:'free', width:90, align:"right"}, 
      {name:'used',index:'used', width:90, align:"right"}, 
      {name:'percentage',index:'percentage', width:120, align:"right"} 
     ], 
     pagination:true, 
     pager : '#gridpager', 
     rowNum:10, 
    viewrecords: true, 
    gridview: true, 
    edit:false, 
    add:false, 
    del:false 

}); 



for(var i=0;i<filesystem.length;i++) 
    jQuery("#list1").jqGrid('addRowData',i+1,filesystem[i]); 

jQuery("#list1").setGridParam({rowNum:10}).trigger("reloadGrid"); 
+0

@doctrey:請看看問題 – Ricky

+0

@Tomas:我創建了一個數據集來匹配jqGrid,並且它也加載,但分頁不起作用。你可以請看看。謝謝 – Ricky

+0

@Oleg:我跟着你的答案[這裏](http://stackoverflow.com/questions/3491963/pagination-problem-in-jqgrid-with-array-data),但仍然沒有運氣,你可以看看也是問題。謝謝:) – Ricky

回答

2

的問題是,你應該的addRowData聖人,而不是之前調用後reloadGrid

,最好的辦法是使用data參數,而不是:

var grid = jQuery("#list1"); 
grid.jqGrid({ 
    datatype: "local", 
    data: filesystem, // here!!! 
    height: "auto", // it can be better if you don't need the fix hight 
    colNames: ['Total Space','Free Space', 'Used Space', 'Used Percentage'], 
    colModel: [ 
     {name:'total',index:'total', width:90, align:"right"}, 
     {name:'free',index:'free', width:90, align:"right"}, 
     {name:'used',index:'used', width:90, align:"right"}, 
     {name:'percentage',index:'percentage', width:120, align:"right"} 
    ], 
    pager : '#gridpager', 
    rowNum:10, 
    rowList:[10,20,30], 
    viewrecords: true, 
    gridview: true 
}); 
grid.jqGrid('navGrid','#gridpager',{edit:false,add:false,del:false}); 

無需重裝格。

如果您填寫rowfilesystem我建議您在row中包含額外的id屬性,該屬性將用作rowid。頁面上使用的所有HTML元素的ID值必須是唯一的。

而不是重新創建div#detailTable包含像你一樣的電話號碼GridUnload(例如here)。你真的需要重新創建網格,而不是隻更改網格包含?要更改網格包含,您可以設置data參數jqGrid相對於setGridParam和調用.trigger("reloadGrid")

+0

感謝它解決了我的問題:) – Ricky

+0

好吧,我添加了一個'ID',但如何使它不出現在表中? – Ricky

+1

@Ricky:不客氣!屬性名稱必須是「id」而不是「ID」。如果你想使用另一個屬性名,你可以使用'localReader:{id:「ID」}'。問題是'

'中的每個''元素都會收到這個id。 'id'將**不顯示**,但是在[onSelectRow](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:events#list_of_events)或類似[ setSelection](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods)網格行將由rowid標識。您可以使用IE或Chrome的開發工具來檢查包含的行並查看ID。 – Oleg