C# 如何在mvc3中启用jQuery网格的导航按钮,并将按钮分配给特定链接?
我已经阅读了一些关于我的问题的主题,但是这些代码不适合我。老实说,我不擅长jQuery 我有这个工作视图和控制器,但它有很多缺点,这就是为什么我改用jQuery网格的原因 不使用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
@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 }