C# 单击网格行时添加详细信息页面Grid.MVC
我不熟悉使用Grid.MVC功能。在看了一些示例之后,我非常喜欢网格,我想知道如何实现与文档页面上的示例类似的解决方案。我已经创建了网格,正在尝试将细节添加到网格右侧,如图所示,但我不确定如何实现它。这是我试图用MVC和Razor实现的exmaple 以下是我的看法:C# 单击网格行时添加详细信息页面Grid.MVC,c#,asp.net-mvc,asp.net-mvc-4,razor,grid,C#,Asp.net Mvc,Asp.net Mvc 4,Razor,Grid,我不熟悉使用Grid.MVC功能。在看了一些示例之后,我非常喜欢网格,我想知道如何实现与文档页面上的示例类似的解决方案。我已经创建了网格,正在尝试将细节添加到网格右侧,如图所示,但我不确定如何实现它。这是我试图用MVC和Razor实现的exmaple 以下是我的看法: @using GridMvc.Html @using GridMvc.Sorting @model IEnumerable<EmployeeManagement.Models.EmployeeMaster> @{
@using GridMvc.Html
@using GridMvc.Sorting
@model IEnumerable<EmployeeManagement.Models.EmployeeMaster>
@{
ViewBag.Title = "Index";
}
<head>
<meta name="viewport" content="width=device-width" />
<link href="@Url.Content("~/Content/Gridmvc.css")" rel="stylesheet" />
<link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" />
<script src="@Url.Content("~/Scripts/jquery-1.9.0.min.js")"></script>
<script src="@Url.Content("~/Scripts/gridmvc.min.js")"></script>
<title>Index</title>
<script>
pageGrids.employeeGrid.onRowSelect(function (e) {
$.post("/Manage/GetEmployee?id=" + e.row.EmployeeNumber, function (data) {
if (data.Status <= 0) {
alert(data.Message);
return;
}
$("#employee-content").html(data.Content);
});
});
</script>
</head>
<div id="grid" style="float: left">
@Html.Grid(Model).Columns(columns =>
{
columns.Add(o => o.LastName)
.Titled("Last Name")
.SetWidth(10);
columns.Add(o => o.FirstName)
.Titled("First Name")
.SortInitialDirection(GridSortDirection.Descending)
.SetWidth(20);
columns.Add(o => o.Initials)
.Titled("Initials").SetWidth(20);
columns.Add(o => o.Branch)
.Titled("Branch").SetWidth(20);
columns.Add(o => o.StatusFlag)
.Titled("Status").SetWidth(20);
columns.Add(o => o.EmployeeNumber)
.Titled("Employee NO")
.SetWidth(10);
columns.Add()
.Encoded(false)
.Sanitized(false)
.SetWidth(30)
.RenderValueAs(d =>
@<b>
@Html.ActionLink("Edit", "Edit")
</b>);
}).SetRowCssClasses(item => (bool)item.StatusFlag ? "success" : "danger").Sortable().Filterable().WithMultipleFilters().Named("employeeGrid")
</div>
<div id="details" style="float:left">
<h2>Details</h2>
<div id="employee-content">
Click on an employee to get their detailed record.
</div>
</div>
找到解决办法了吗?
[HttpPost]
public EmployeeMaster GetEmployee(int id)
{
var e = EmployeeDb.EmployeeMasters.FirstOrDefault(x => x.EmployeeNumber == id);
return e;
}