在Visual Studio中安装DataTable Jquery插件

Question

我正在关注与Razor Views相关的Jquery的简短教程，我试图安装DataTables Jquery插件。我正在使用ASP.net MVC，这是我第一次尝试安装Jquery插件。我有一个索引视图，我想更改使用DataTable插件显示的表，我已经下载了插件，接下来我试图复制Scripts文件中的整个插件并引用jquery.dataTables来自我的索引视图，在解决方案资源管理器中，DataTables插件文件的颜色为白色，就像显示它有问题一样。我在教程中读到使用此插件的正确方法是使用View中的引用，如：

   @section PageScripts{
<link href="/Content/css/jquery.dataTables.bootstrap.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery.dataTables.js" type="text/javascript"></script>

我已经尝试过这种方式而且表格没有修改。我认为我没有考虑安装这个插件的明显事实。 我已经读过在App_Start文件夹中使用BundleConfig来引用Jquery脚本，然后从这样的视图中调用它们：

@section Scripts {
    @Scripts.Render("~/bundles/jquerydatatable")
    }

Razor Views中的最佳做法是使用BundleConfig吗？

索引视图：

@model IEnumerable<AlexMusicStore.Models.Student>
@{
    ViewBag.Title = "Index";
}
<table>
//some other content here...
</table>
@section Scripts {
    @Scripts.Render("~/bundles/jquerydatatable")
    }

如果我在Visual Studio目录中手动复制文件，则显示白色文件而不是javascript图标：

Answer 1

添加如下js，

之类的包配置

 bundles.Add(new ScriptBundle("~/bundles/gridresponsive").Include(
                     "~/Scripts/GridResponsive/jquery.dataTables.js",
                     "~/Scripts/GridResponsive/dataTables.bootstrap.js",
                     "~/Scripts/GridResponsive/dataTables.responsive.js",
                     "~/Scripts/GridResponsive/responsive.bootstrap.js"));

的CSS，

bundles.Add(new StyleBundle("~/Content/gridcss").Include(
                      "~/Content/GridResponsive/dataTables.bootstrap.css",
                      "~/Content/GridResponsive/responsive.bootstrap.css"));

并在视图中添加引用，

@Scripts.Render("~/bundles/gridresponsive")
@Styles.Render("~/Content/gridcss")