首页 > 解决方案 > ASP.NET MVC 无法让 Jquery 验证在 _layout 中的表单上工作

问题描述

我的 _layout 中有一个导航栏,其中包含一个下拉列表,在此下拉列表中呈现部分视图(包含登录表单),尽管存在 JQuery 验证脚本(通过捆绑配置),并且我的模型具有正确的数据注释,表单输入不会验证,但是如果部分呈现在正文中,则验证工作正常。

然后我假设有关布局的某些东西(或者可能是下拉列表中的表单)导致了问题。

我布局的重要部分......

@Scripts.Render("~/bundles/jquerybase")
@Scripts.Render("~/bundles/jqueryajax")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap")
@Styles.Render("~/Styles/bootstrap")
@Styles.Render("~/Styles/css")


<nav class="navbar navbar-inverse navbar-fixed-top" id="MainNavbar">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">Logo</a>
        </div>
        <ul class="nav navbar-nav">
            <li>@Html.ActionLink("Home", "Index", "Home")</li>
            <li>@Html.ActionLink("About", "About", "Home")</li>
            <li>@Html.ActionLink("Contact", "Contact", "Home")</li>               
        </ul>
        <ul class="nav navbar-nav navbar-right float-right">
            @if (!User.Identity.IsAuthenticated)
            {
                <li>
                    <a href="#" class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        <span class="glyphicon glyphicon-log-in"></span> Login
                    </a>

                    <div class="dropdown-menu" id="dropdownLogon">
                        @Html.Partial("~/Views/User/Logon.cshtml", new SiteProject.Models.UserModel())
                    </div>
             }
                </li>
         </ul>
    </div>
</nav>

我的部分观点:

@model SiteProject.Models.UserModel

@using (Html.BeginForm("Logon", "User", FormMethod.Post, new { htmlAttributes = new { Id = "logonForm", name = "logonForm" } }))
{

    @Html.AntiForgeryToken()
    <form class="px-4 py-3">
        <div class="form-group">
            @Html.Label("Username", htmlAttributes: new { id = "UserNameLabel" })
            @Html.EditorFor(m => m.UserName, new { htmlAttributes = new { id = "Username", @class = "form-control", } })
            @Html.ValidationMessageFor(m => m.UserName, "", new { @class = "text-danger" })

        </div>
        <div class="form-group">
            @Html.Label("Password", htmlAttributes: new { id = "PasswordLabel" })
            @Html.EditorFor(m => m.Password, new { htmlAttributes = new { @type = "password", id = "Password", @class = "form-control", } })
            @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
        </div>
        <button type="submit" class="btn btn-primary">Sign in</button>
    </form>
    <br />
    <div class="dropdown-divider"></div>
    <div>
        <a class="dropdown-item" href="#">Forgot password?</a>
    </div>

}

任何人都可以阐明原因以及解决方案是什么。

谢谢你。

标签: jqueryasp.net-mvc

解决方案


推荐阅读