jqgrid客戶端與服務器端分頁排序 - 數據消失

它在jqgrid文檔中聲明下面的代碼應該允許使用服務器端分頁進行本地排序; 網格數據在分頁上消失;這個問題已被問及以前沒有明確的答案 - 建議使用loadonce：true意味着分頁關閉 - 我需要分頁jqgrid客戶端與服務器端分頁排序 - 數據消失

編輯後顯示完整的html頁面和json響應（我現在運行這從一個PHP/mysql後端）。 1日負荷

我完全的HTML頁面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>JQGrid Test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<link rel="stylesheet" type="text/css" href="../dojoproject/jquery-ui-1.8.16.custom/css/start/jquery-ui-1.8.16.custom.css"> 
<link rel="stylesheet" type="text/css" href="jquery.jqGrid-4.3.1/css/ui.jqgrid.css"> 
<style type="text/css"> 
html, body { 
    margin: 0; 
    padding: 0; 
    font-size: 90%; 
} 
</style> 
<script type="text/javascript" src="../dojoproject/jquery-ui-1.8.16.custom/js/jquery-1.6.2.min.js" ></script> 
<script type="text/javascript" src="../dojoproject/jquery-ui-1.8.16.custom/js/jquery-ui-1.8.16.custom.min.js" ></script> 
<script type="text/javascript" src="jquery.jqGrid-4.3.1/js/i18n/grid.locale-en.js" ></script> 
<script type="text/javascript" src="jquery.jqGrid-4.3.1/js/jquery.jqGrid.min.js" ></script> 
<script type="text/javascript" src="../dojoproject/jqGrid-4.1.2/js/JSON-js/json2.js" ></script> 

<script> 

$(function() { 
$('#table').jqGrid({ 
    jsonReader : { 
    repeatitems: false, 
    cell:"", 
    id:"0" 
    }, 
    height:'auto', 
    url:'/jqgrid/orderdetails.php', 
    postData:{test:'value'}, 
    datatype: 'json', 
    mtype: 'POST', 
    rownumbers:true, 
    rownumWidth:35, 
    colNames:['OrderID','UnitPrice','Quantity','Discount','ProductName'], 
    colModel :[ 
     {name:'OrderID', index:'OrderID',search:false,sorttype:'integer'}, 
     {name:'UnitPrice', index:'UnitPrice',editable:true,sorttype:'float'}, 
     {name:'Quantity', index:'Quantity',sorttype:'int'}, 
     {name:'Discount', index:'Discount',sorttype:'int'}, 
     {name:'ProductName', index:'ProductName'} 
    ], 
    sortname: 'OrderID ', 
    rowNum:5, 
    sortorder: 'asc', 
    width:'100%', 
    height:'200', 
    viewrecords: true, 
    gridview: true, 
    caption: 'NorthWind Orders', 
    scrollOffset:18, 
    multiselect:true, 
    pager:'pager' 
    ,cellEdit:true, 
    cellsubmit:'clientArray', 
    afterSaveCell:function(rowid, cellname, value, iRow, iCol){ 
    }, 
     onPaging: function() { 
     $("#table").setGridParam({datatype:'json'}).trigger("reloadGrid"); 
     },    
    loadComplete: function (data) { 
     $("#table").setGridParam({datatype:'local'}).trigger("reloadGrid"); 
     } 
    }); 
}); 

</script> 

</head> 
<body> 

<table id='table'></table> 
<div id='pager'></div> 
</body> 
</html>

響應是從第2頁

{"page":"1","total":431,"records":2155,"rows":[{"OrderID":"1024811","UnitPrice":"14.0000","Quantity":"12","Discount":"0"},{"OrderID":"1024842","UnitPrice":"9.8000","Quantity":"10","Discount":"0"},{"OrderID":"1024872","UnitPrice":"34.8000","Quantity":"5","Discount":"0"},{"OrderID":"1024914","UnitPrice":"18.6000","Quantity":"9","Discount":"0"},{"OrderID":"1024951","UnitPrice":"42.4000","Quantity":"40","Discount":"0"}]}

響應：

{"page":"2","total":431,"records":2155,"rows":[{"OrderID":"1025041","UnitPrice":"7.7000","Quantity":"10","Discount":"0"},{"OrderID":"1025051","UnitPrice":"42.4000","Quantity":"35","Discount":"0.15"},{"OrderID":"1025065","UnitPrice":"16.8000","Quantity":"15","Discount":"0.15"},{"OrderID":"1025122","UnitPrice":"16.8000","Quantity":"6","Discount":"0.05"},{"OrderID":"1025157","UnitPrice":"15.6000","Quantity":"15","Discount":"0.05"}]}

來源

2012-01-27 Pete_ch

問題的原因可能不僅僅是jqGrid中的一個bug，還包括服務器部分提供的數據中的錯誤，您在'colModel'中使用的格式化程序等等。您能否包含jqGrid的更多完整定義以及從服務器返回的兩個JSON響應：第一個將響應第一個頁面的請求，第二個響應來自第二個頁面的請求。擁有所有數據可以重現您的問題。儘管如此，我個人在本地排序和服務器端分頁的組合方面意識不強。 – Oleg 2012-01-27 07:58:29

我喜歡客戶端排序，以避免需要實現服務器端排序，除了性能 - 除非有人建議使用LINQ to sql – 2012-01-27 08:17:59

無痛多列服務器排序（和多列搜索:-)）您發佈的JSON響應不是完整的，所以它不能用來重現問題。我現在看到你使用'scroll：1'，它在*不分頁數據*中。它是*虛擬滾動*。我認爲你應該刪除使程序運行的選項。從性能的角度來看，服務器端的數據排序更加有效。此外，如果用戶請求獲取按列來排序的第一頁數據，則必須先對數據進行排序，然後獲取結果的第一頁以提供正確的響應。 – Oleg 2012-01-27 09:08:03

所有我想首先再說一遍，我不建議您使用本地排序和服務器端分頁。我發現用戶可能會錯誤地解釋排序的結果。

不過，如果客戶同意限制具有本地排序和服務器端分頁的組合，如果你真的需要實現的是，我可以建議你將以下解決方案：

onPaging: function() { 
    $(this).setGridParam({datatype: 'json'}).triggerHandler("reloadGrid"); 
}, 
loadComplete: function (data) { 
    var $this = $(this); 
    if ($this.jqGrid('getGridParam', 'datatype') === 'json') { 
     // because one use repeatitems: false option and uses no 
     // jsonmap in the colModel the setting of data parameter 
     // is very easy. We can set data parameter to data.rows: 
     $this.jqGrid('setGridParam', { 
      datatype: 'local', 
      data: data.rows, 
      pageServer: data.page, 
      recordsServer: data.records, 
      lastpageServer: data.total 
     }); 

     // because we changed the value of the data parameter 
     // we need update internal _index parameter: 
     this.refreshIndex(); 

     if ($this.jqGrid('getGridParam', 'sortname') !== '') { 
      // we need reload grid only if we use sortname parameter, 
      // but the server return unsorted data 
      $this.triggerHandler('reloadGrid'); 
     } 
    } else { 
     $this.jqGrid('setGridParam', { 
      page: $this.jqGrid('getGridParam', 'pageServer'), 
      records: $this.jqGrid('getGridParam', 'recordsServer'), 
      lastpage: $this.jqGrid('getGridParam', 'lastpageServer') 
     }); 
     this.updatepager(false, true); 
    } 
}

如果你不使用repeatitems: false填充jqGrid的data參數的代碼會稍微長一些，但它會起作用。

來源

2012-01-28 17:17:17 Oleg

這個解決方案只是一個小故障 - 在排序第1頁以外的頁面時，尋呼機跳回第1頁，但數據正常 – 2012-01-29 01:20:10

@chohi：頁碼的問題可以很容易修復。查看我答案的更新代碼。 – Oleg 2012-01-29 10:12:30

謝謝奧列格 - 這個作品完美;我也接受你的建議，並在以後使用服務器排序 – 2012-01-29 17:22:11

上述解決方案工作正常，除非我們在網格的最後一頁，例如我有3行顯示在最後一頁，儘管頁面可以容納5行。

現在，如果我嘗試做客戶端排序，最後一頁將被填充2個額外的行，總共5行將被排序。我會說，可能是最後提取的記錄存儲在緩衝區，所以這是發生。至於定爲這，onPagination，清除電網提高電網的「JSON」之前，像

clickOnPagination = function() { $(this).jqGrid("clearGridData"); $(this).setGridParam({datatype: 'json'}).triggerHandler("reloadGrid"); }

和源代碼註釋行
$t.p.records = 0;$t.p.page=1;$t.p.lastpage=0;在clearGridData功能，使下一個分頁將正常工作。

來源

2012-11-21 12:00:02 venugopal

不錯，但對源代碼進行更改不是一個好的維護主意。 – darksoulsong 2014-10-30 17:26:14

jqgrid客戶端與服務器端分頁排序 - 數據消失

回答

相關問題