1
我正在尝试获取DataTables在MVC 6项目中的工作。我有整个项目的工作，但试图列出用户时，它不使用DataTables。何处以及如何将DataTables添加到MVC 6项目？
我不确定在MVC 6项目中添加什么内容和添加什么内容。一切都在不同的位置。我运行了Nuget Package Manager并找到了一些东西，并将其添加到我的project.json文件中：“jquery.datatables”：“1.10.10”
但DataTables不起作用。我知道这是对我的问题的一个可怕的描述，但我很确定我没有正确的.js和.css文件在正确的位置。但是去DataTables下载网站没有任何帮助，因为有一百万个下载选择。
这是我的观点，列出注册用户。它的工作原理，但不使用数据表，并且如果未找到数据表则不会触发警报。 DataTables的默认安装内置了搜索框和OrderBy箭头。没有当前的视图 - 哪些工作，但没有DataTables。
@model List<MVC6.Models.UserViewModel>
@{
ViewBag.Title = "Users";
}
<ol class="breadcrumb">
<li>@Html.ActionLink("Administration", "Index", "Admin")</li>
<li>Users</li>
</ol>
<h2>@ViewBag.Title</h2>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
try {
$('#users').dataTable({});
} catch (err) {
alert(err + ":\n Datatables installed? Included in Resource bundle?");
}
});
</script>
@if (!ViewData.ModelState.IsValid)
{
<div class="alert alert-danger" role="alert">
<div asp-validation-summary="ValidationSummary.All"></div>
@*@Html.ValidationSummary()*@
</div>
}
<fieldset>
<table id="users" class="display">
<thead>
<tr>
<th width="20%">Email</th>
<th width="20%">Roles</th>
<th width="20%">Action</th>
</tr>
</thead>
<tbody>
@if (null != Model)
{
foreach (var user in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => user.Email)
</td>
<td>
@if (null != user.Roles)
{
@*foreach (var role in user.Roles)
{
@role
<br />
}*@
@user.Roles
}
</td>
<td>
<div class="btn-group" role="group" aria-label="...">
@Html.ActionLink("Edit", "Edit", new { userId = user.UserId }, new { @class = "btn btn-default" })
@Html.ActionLink("Delete", "Delete", new { userId = user.UserId }, new { onclick = "return confirm('Are you sure you want to delete this user?')", @class = "btn btn-default" })
</div>
</td>
</tr>
}
}
</tbody>
</table>
</fieldset>
我想了想，想显示其中的引用可能把我的_Layout.cshtml文件。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - MVC6</title>
<environment names="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment names="Staging,Production">
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.5/css/bootstrap.min.css"
asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
<link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a asp-controller="Home" asp-action="Index" class="navbar-brand">MVC6</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a asp-controller="Home" asp-action="Index">Home</a></li>
<li><a asp-controller="Home" asp-action="About">About</a></li>
<li><a asp-controller="Home" asp-action="Contact">Contact</a></li>
</ul>
@await Html.PartialAsync("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© 2016 - MVC6</p>
</footer>
</div>
<environment names="Development">
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
</environment>
<environment names="Staging,Production">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js"
asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
asp-fallback-test="window.jQuery">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.5/bootstrap.min.js"
asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal">
</script>
<script src="~/js/site.min.js" asp-append-version="true"></script>
</environment>
@RenderSection("scripts", required: false)
</body>
</html>