您可以使用AJAXMicrosoft.AspNet.DynamicData.EFProvider
和 ASP.NET MVC,而无需下载我认为的 EntityFramework 之外的单独 NuGet 包:
首先在数据库中创建一个员工表,其中包含 EmployeeId、EmployeeName、Email、Phone 和 Experience。
然后在 Visual Studio 中创建一个 ASP.NET Web 应用程序,选择 MVC。现在将它添加到您的 HomeController 中:
public class HomeController : Controller
{
MyEntities db = new MyEntities ();
public ActionResult Index()
{
return View(db.EmployeeInfos.ToList());
}
public ActionResult EmployeeInfo(int id)
{
List<EmployeeInfo> EmpInfo = db.EmployeeInfos.Where(x => x.EmployeeId == id).ToList();
return View(EmpInfo);
}
}
接下来在您的 HomeController 视图中打开 Index.cshml,并输入以下代码:
@model IEnumerable<DynamicallyLoadingContant.Models.EmployeeInfo>
<br /><br />
<div class="container">
<h3 style="text-align:center">-----Employee List-----</h3><br />
<table class="table table-bordered">
<tr>
<th style="width:20%">ID</th>
<th style="width:80%">Name</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>@item.EmployeeId</td>
<td><a href="#" data-toggle="popover" data-trigger="hover" id="@item.EmployeeId">@item.EmployeeName</a></td>
</tr>
}
</table>
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function () {
$('[data-toggle="popover"]').popover({
title: setData,
html: true,
placement:'right'
});
function setData(id) {
var set_data = '';
var element = $(this);
var id = element.attr("id");
$.ajax({
url: "/Home/EmployeeInfo?id" + id,
method: "post",
async: false,
data: { id: id },
success: function (data) {
set_data = data;
}
});
return set_data;
}
});
</script>
接下来添加另一个 EmployeeInfo.cshtml 视图:
@model IEnumerable<DynamicallyLoadingContant.Models.EmployeeInfo>
@{
ViewBag.Title = "EmployeeInfo";
}
<div class="container">
<h4 style=" text-align:center;border-bottom:1px solid #808080">EmployeeInfo</h4>
@foreach (var item in Model)
{
<p><label>Name : </label> @item.EmployeeName</p>
<p><label>Email : </label> @item.Email</p>
<p><label>Phone : </label> @item.Phone</p>
<p><label>Experience : </label> @item.Experience</p>
}
</div>
更多详细信息,请参见http://abctutorial.com/Post/29/dynamically-loading-content-with-jquery-ajax-%7C-aspnet-mvc