Question

我正在开发VS 2015社区版的项目，我正在尝试使用jquery datatable插件并按照教程中显示的所有步骤进行操作，但仍然无法使用该插件。我已经通过成功安装的软件包管理器安装了jquery.datatables软件包，然后在bundle.config中添加了脚本，但我的页面加载了没有Datatable插件，我还安装了bootbox插件，工作正常。需要帮助，我正在分享代码和快照！

PS：我的VS智能没有给出Datatable的建议，当我重新启动VS并尝试bhild项目时，我得到了以下错误。（当运行VS作为管理员时，我没有得到这个错误但是Datatable插件仍然没有的工作原理。

Error

Installed Successfully

VS intelligence not giving suggestion for DataTable

Page loaded after build

BundleConfig.cs

using System.Web;
using System.Web.Optimization;

namespace Vidly
{
    public class BundleConfig
    {
        // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/lib").Include(
                        "~/Scripts/jquery-{version}.js",
                        "~/Scripts/bootstrap.js",
                        "~/Scripts/bootbox.js",
                        "~/Scripts/respond.js",
                        "~/scripts/datatables/jquery.datatables.js",
                        "~/scripts/datatables/datatables.bootstrap.js"
                        ));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));



            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/content/datatables/css/datatables.bootstrap.css",
                      "~/Content/site.css"));
        }
    }
}

的index.html

@model IEnumerable<Vidly.Models.Customer>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Customers</h2>

@if (!Model.Any())
{
    <p>We don't have any customers yet</p>
}
else
{
    <table id="customers" class=  "table table-bordered table-hover" >
        <thead>
            <tr>
                <th>
                    Customers
                </th>
                <th>Membership Type</th>
                <th>Delete</th>
            </tr>
        </thead>

        <tbody>
            @foreach (var customer in Model)
            {
                <tr>
                    <td>
                        @Html.ActionLink(customer.Name, "Edit", "Customers", new { id = customer.Id}, null )
                    </td>
                    <td>@customer.MembershipType.Name</td>
                    <td>
                        <button data-customer-id="@customer.Id" class="btn-link js-delete">Delete</button>
                    </td>
                </tr>

            }
        </tbody>

    </table>
}

@section scripts
    {
    <script>
        $(document).ready(function () {

            $("customers").DataTable();

            $("#customers").on("click", ".js-delete", function () {
                var button = $(this);

                bootbox.confirm("Are you sure you want to delete this customer?", function (result) {
                    if (result) {
                        $.ajax({
                            url: "/api/customers/" + button.attr("data-customer-id"),
                            method: "DELETE",
                            success: function () {
                                button.parents("tr").remove();
                            }
                        });
                    }
                });                
            });
        });
    </script>    
    }

Jquery DataTable插件无法正常工作

0 个答案: