mvc3のjQueryグリッドのナビゲーションボタンを有効にして特定のリンクにボタンを割り当てる方法は？

Question

私は私の質問に関していくつかの話題を読んだが、コードは私のためには機能しない。正直なところ、私はjQueryがうまくいきません。

私はこの作業ビューとコントローラを持っていますが、jQueryグリッドの使用に切り替える理由は非常に不利です。

コード（jQueryのグリッドを使用していない）の作業：サイドエリア内のリンクを解決するには

@using Custom.Helpers 
@model IEnumerable<Models.DeviceMVC> 

@{ 
    ViewBag.Title = "List"; 
} 

<div id="page-title"> 
<h2>Device list</h2> 
    <div id="Optiontab"> 
     @Html.ActionLink("Create New", "Create") 
    </div> 
</div> 
<table id="table-list"> 
    <tr> 
     <th> 
      Branch 
     </th> 
     <th> 
      Name 
     </th> 
     <th> 
      Login id 
     </th> 
     <th> 
      Serial number 
     </th> 
     <th> 
      Brand 
     </th> 
     <th> 
      Model 
     </th> 
     <th></th> 
    </tr> 

@foreach (var item in Model) { 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.BranchName) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Name) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.LoginID) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.SerialNum) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Brand) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Model) 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "Edit", new { id = item.DeviceID, branch = item.BranchName }) | 
      @Html.ActionLink("Details", "Details", new { id=item.DeviceID }) 
     </td> 
    </tr> 
} 
</table> 

を、私はこのヘルパーを使用します。
Helper

データをロードするには：

public ActionResult Index() 
{ 
    IDeviceComponentMVC mvc = new DeviceComponentMVC(); 
    return View(mvc.RetrieveAllDevices()); 
} 

jQueryで（表示部分）：

<script type="text/javascript"> 
    jQuery(document).ready(function() { 
     jQuery("#list").jqGrid({ 
      url: '@Url.Content("~/Device/LoadDevice")', 
      datatype: 'json', 
      mtype: 'POST', 
      colNames: ['Branch', 'Name', 'Username', 'Serial', 'Brand', 'Model'], 
      colModel: [ 
      { name: 'Branch', index: 'Branch', width: 136, align: 'Branch', sortable: false }, 
      { name: 'Name', index: 'Name', width: 136, align: 'Name' }, 
      { name: 'LoginID', index: 'LoginID', width: 136, align: 'LoginID' }, 
      { name: 'SerialNum', index: 'SerialNum', width: 100, align: 'SerialNum' }, 
      { name: 'Brand', index: 'Brand', width: 136, align: 'Brand' }, 
      { name: 'Model', index: 'Model', width: 136, align: 'Model' } 
      ], 
      pager: jQuery('#pager'), 
      rowNum: 5, 
      rowList: [10, 50, 100, 150, 250, 300, 350, 400, 500], 
      sortname: 'Name', 
      sortorder: "desc", 
      viewrecords: true, 
      imgpath: '', 
      caption: 'Device list' 
     }) 
    }); 

</script> 
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table> 
<div id="pager" class="scroll" style="text-align:center; padding:50px;"></div> 

コントローラー部分：

しかし、これらのボタンは、特定のリンクを持っている必要があります。

public JsonResult LoadDevice(string sidx, string sord, int page, int rows) 
{ 
    using (DBase db = new DBase()) 
    { 
     var context = db; 
     int pageIndex = Convert.ToInt32(page) - 1; 
     int pageSize = rows; 
     int totalRecords = context.devices.Count(); 
     int totalPages = (int)Math.Ceiling((float)totalRecords/(float)pageSize); 

     var devices = context.devices.OrderBy("it." + sidx + " " + sord).Skip(pageIndex * pageSize).Take(pageSize); 

     var sorted = (from item in devices 
         select new 
         { 
          i = item.DeviceID, 
          cell = new List<string> { item.branch.Name, item.Name, item.LoginID, item.SerialNum, item.Brand, item.Model } 
         }).ToArray(); 

     var jsonData = new 
     { 
      total = totalPages, 
      page, 
      records = totalRecords, 
      rows = sorted 
     }; 
     return Json(jsonData); 
    } 
} 

は今、私の非常に目標は、このようにナビゲーションボタンを置くことです。私の最初のビュー（jQueryグリッド無し）のようなリンク。

は現在、私は持っている：

は、誰かが助けることができる願っています。どうもありがとう！

Answer 1

あなたのスクリプトでは1行が間違っています。最後の行はこのように見えるようにするために、スクリプトにこれを追加：

 caption: 'Device list' 
    }).navGrid("#pager, { add: false, edit: false, del: false } 

この関数のすべての詳細についてhttp://www.trirand.com/jqgridwiki/doku.php?id=wiki:navigatorを参照してください。