jquery - 添加jquery.validate后表单停止提交

Question

这是我的 Controller 代码:

[HttpPost]

[ValidateAntiForgeryToken]

public async Task<ActionResult> Create([Bind(Include = "Id,Name,Description,FolioId,Permission,CreatedOn,  CreatedUser,Published")] Categories categories)
{
    if (ModelState.IsValid)
    {
        MembershipUser user = Membership.GetUser(User.Identity.Name);
        Guid guid = (Guid)user.ProviderUserKey;
        Methods method = new Methods();

        string NowTime = method.TodayDate(1) + " - " + DateTime.Now.ToString("HH:mm");

        categories.CreatedUser = guid;
        categories.CreatedOn = NowTime;

        db.Categories.Add(categories);
        await db.SaveChangesAsync();

        return RedirectToAction("Index");
    }
    return View(categories);
}

这是我的观点:

@model XS.Models.Articles.Categories.Categories
@{
    ViewBag.Title = "Create List";
    Layout = "~/Areas/_AdminLayout.cshtml";
}

<div style="margin-top:30px;padding-bottom:2px;">
     <img src="~/Content/images/category.png" style="position:absolute;" />
     <h3 style="padding-top:20px; margin-right:70px;">Lists</h3>
</div>

<hr />

@using (Html.BeginForm()) {
    @Html.AntiForgeryToken()

    <div>
        @Html.ValidationSummary(true)
        <div>
            @Html.LabelFor(model => model.FolioId)
            <div>
                @Html.DropDownListFor(x => x.FolioId, Model.FolioName, new { @class = "DropDown_Width150" })
                @Html.ValidationMessageFor(model => model.FolioName)
            </div>
        </div>

        <br />

        <div>
            @Html.LabelFor(model => model.Name)
            <div>
                @Html.EditorFor(model => model.Name)
                @Html.ValidationMessageFor(model => model.Name)

            </div>
        </div>

        <br />

        <div>
            @Html.LabelFor(model => model.Description)
            <div>
                @Html.EditorFor(model => model.Description)
                @Html.ValidationMessageFor(model => model.Description)
            </div>
        </div>

        <br />

        <div>
            @Html.LabelFor(model => model.Permission)
            <div>
                @Html.EditorFor(model => model.Permission)
                @Html.ValidationMessageFor(model => model.Permission)
            </div>
        </div>

        <br />

        <div>        
            <label class="switch switch-fullgreen">
                @Html.EditorFor(model => model.Published)
                <span class="switch-label" data-on="Enable" data-off="Disable"></span>
                <span class="switch-handle"></span>

            </label>  

            @Html.ValidationMessageFor(model => model.Published)
        </div>

        <br />

        <div>
            <div>
                <input type="submit" id="submit" value="Create List" class="btn btn-success" />
                @Html.ActionLink("Return", "Index")

            </div>

        </div>
    </div>
}



<script>     
    $(document).ready(function () {
        $('#Published').addClass("switch-input")
    });
</script>

正常情况下没有问题。但是当我将 jquery.validation js 文件添加到我的项目中以进行不引人注目的验证时，问题就出现了。 它发生在我添加后:

jquery.validate.min.js 和 jquery.validate.unobtrusive.min.js

到我的布局。

它的边界:

 bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(

                   "~/Scripts/jquery.unobtrusive*",

                   "~/Scripts/jquery.validate*"));

在 webconfig 中:

<add key="ClientValidationEnabled" value="true" />

<add key="UnobtrusiveJavaScriptEnabled" value="true" />

Answer 1

尝试更改文件的顺序并确保也引用了 jquery。

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

                   "~/Scripts/jquery.unobtrusive*"

));