C# 如何在mvc3中启用jQuery网格的导航按钮,并将按钮分配给特定链接?

C# 如何在mvc3中启用jQuery网格的导航按钮,并将按钮分配给特定链接?,c#,jquery,asp.net-mvc,asp.net-mvc-3,C#,Jquery,Asp.net Mvc,Asp.net Mvc 3,我已经阅读了一些关于我的问题的主题,但是这些代码不适合我。老实说,我不擅长jQuery 我有这个工作视图和控制器,但它有很多缺点,这就是为什么我改用jQuery网格的原因 不使用jQuery网格的工作代码: @using Custom.Helpers @model IEnumerable<Models.DeviceMVC> @{ ViewBag.Title = "List"; } <div id="page-title"> <h2>Device l

我已经阅读了一些关于我的问题的主题,但是这些代码不适合我。老实说,我不擅长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>  
现在在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网格的第一个视图一样

目前我有:


希望有人能帮忙。非常感谢

脚本中缺少一行。将其附加到脚本中,使最后一行如下所示:

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

有关此功能的所有详细信息,请参阅。

我的问题仍然可以帮助其他人。我在这里找到了最佳答案:
       caption: 'Device list'
    }).navGrid("#pager, { add: false, edit: false, del: false }