2013-09-24 94 views
3

我在我的jqGrid中使用rowNum時遇到了問題。我試圖讓網格只加載我在rowNum中指定的行數。目前網格正在加載數組中的所有數據。jqGrid加載所有行,忽略rowNum

這裏是我的網格:

$(function() { 
    var width = $(window).width() - 50; 
    $("#category_grid").jqGrid({ 
     datatype: "local", 
     width: width, 
     height: "auto", 
     search: true, 
     autowidth: false, 
     shrinkToFit: true, 
     colNames: ['ID', 'Name', 'Abbr.', 'Last Update', 'Last Update User', 'Active?', 'Edit'], 
     colModel: [ 
      { name: 'ID', width: 5, align: 'center', sorttype: 'int' }, 
      { name: 'Name', width: 15, align: 'left' }, 
      { name: 'Abbreviation', width: 10, align: 'left' }, 
      { name: 'LastUpdateDateTime', width: 8, align: 'left', formatter: dateFix, sorttype: 'date' }, 
      { name: 'LastUpdateUser', width: 15, align: 'left', sorttype: 'string' }, 
      { name: 'Active', width: 5, align: 'center', formatter: activeFix }, 
      { name: 'Edit', width: 5, align: 'center' }, 
     ], 
     rowNum: 20, 
     rowList: [20, 50, 100, 1000, 100000], 
     viewrecords: true, 
     pager: "#gridpager", 
     sortname: "ID", 
     sortable: true, 
     ignoreCase: true, 
     headertitles: true, 
     sortorder: "desc", 
     onSelectRow: function (rowId) 
     { 
      var id = $("#category_grid").getCell(rowId, 'ID'); 
      document.location.href = '/Administration/EditCategoryRecord/'+ id; 
     }, 
    }).navGrid("#gridpager", { edit: false, add: false, del: false }, {}, {}, {}, { multipleSearch: true, multipleGroup: false, showQuery: false, recreateFilter: true }); 
    $("#category_grid").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: true, defaultSearch: 'cn' }) 
    setTimeout(function() { getCategories(); }, 200); 
}); 

function getCategories() { 
    var data; 
    var request = $.ajax({ 
     url: "@Url.Action("GetCategories", "Administration")", 
      type: "GET", 
      cache: false, 
      async: true, 
      data: data, 
      dataType: "json", 
     }); 
    request.done(function (orders) { 
      var thegrid = $("#category_grid"); 
      thegrid.clearGridData(); 
      setTimeout(function() { 
       for (var i = 0; i < orders.length; i++) { 
        thegrid.addRowData(i + 1, orders[i]); 
       } 
      }, 500); 
      //alert(thegrid.jqGrid('getGridParam', 'rowNum')); 
      thegrid.trigger("reloadGrid"); 
      //alert(thegrid.jqGrid('getGridParam', 'rowNum')); 

     }); 
     request.fail(function (orders) { 
      alert("The request in the getCategories function failed. The grid will not be filled."); 
     }); 
} 

而這裏的發送網格中的數據的控制器動作:

public JsonResult GetCategories() 
    { 
     // Holds all of the Categories as an array to fill the jqGrid 
     object data; 

     // Holds all of the Categories in the db 
     List<Category> Categories; 

     // Holds all of the Categories in the db with Usernames as a string instead of an int ID 
     List<Category> CategoriesWithUserNames = new List<Category>(); 

     // Get all of the current Categories 
     using (TicketDeskContext context = new TicketDeskContext()) 
      Categories = context.Categories.ToList(); 

     // For every Category, add to the List of Categories with Usernames as a string 
     foreach (Category Category in Categories) 
     { 
      string LastUpdateUser = Functions.GetUserNameByID(Category.LastUpdateUserID); 
      CategoriesWithUserNames.Add(new Category(Category.ID, Category.Active, Category.Name, Category.Abbreviation, Category.LastUpdateDateTime, LastUpdateUser)); 
     } 

     // Convert the filtered Category List to the data array 
     data = CategoriesWithUserNames.ToArray(); 

     // Return the filtered Category List 
     return Json(data, JsonRequestBehavior.AllowGet); 
    } 

是否有東西,我做錯了什麼?當網格加載它不會停在20(因爲我設置rowNum爲20),它只是加載所有的數據(目前是27類)。

回答

3

我解決了這個問題,通過觸發setTimeout中的網格重新加載。

function getCategories() 
{ 
    var data; 

    var request = $.ajax({ 
     url: "@Url.Action("GetCategories", "Administration")", 
      type: "GET", 
      cache: false, 
      async: true, 
      data: data, 
      dataType: "json", 
     }); 

    request.done(function (orders) { 
      var thegrid = $("#category_grid"); 
      thegrid.clearGridData(); 
      setTimeout(function() { 
       for (var i = 0; i < orders.length; i++) 
       { 
        thegrid.addRowData(i + 1, orders[i]); 
       } 
       // Triggering a grid reload here loads the grid with the number specified in rowNum 
       thegrid.trigger("reloadGrid"); 
      }, 500); 
     }); 
     request.fail(function (orders) 
     { 

     }); 
} 
1

在rowNum:20後添加loadonce:true。這應該解決分頁問題。

+1

感謝您的回覆。我嘗試添加loadonce:true,但網格仍在加載超過20行。任何其他想法? –

+0

您可以嘗試使用url:「」並按照本鏈接「http://trirand.com/blog/jqgrid/jqgrid.html」中提到的方法進行單獨的Ajax調用,而不是進行單獨的Ajax調用。我用這種方法,它幫助了我 – vejay2k