MVC3客户端验证无效

时间:2013-03-30 11:01:33

标签: asp.net-mvc-3 client-side-validation

我的应用程序中有一个页面,我使用validate.min.jsvalidate.unobtrusive.min.js应用了MVC客户端验证,但它无效。验证在服务器端正常工作,但在客户端没有。我认为用于菜单的js可能会产生问题。但我无法理解如何解决它,因为我使用的菜单我需要菜单效果。

任何人如果有任何想法请分享。

查看页面代码:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<ApricaCRMEvent.Models.User_Detail>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    RegisterUser1
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<h2>RegisterUser1</h2>

<script src="<%: Url.Content("~/Scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js") %>" type="text/javascript"></script>

<% using (Html.BeginForm()) { %>
    <%: Html.ValidationSummary(true) %>
    <fieldset>
        <legend>User_Detail</legend>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.Username) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.Username) %>
            <%: Html.ValidationMessageFor(model => model.Username) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.Password) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.Password) %>
            <%: Html.ValidationMessageFor(model => model.Password) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.Email_Add) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.Email_Add) %>
            <%: Html.ValidationMessageFor(model => model.Email_Add) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.Alt_Email_Add) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.Alt_Email_Add) %>
            <%: Html.ValidationMessageFor(model => model.Alt_Email_Add) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.ConfirmPassword) %>
        </div>
        <div class="editor-field">
            <%: Html.EditorFor(model => model.ConfirmPassword) %>
            <%: Html.ValidationMessageFor(model => model.ConfirmPassword) %>
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
<% } %>

<div>
    <%: Html.ActionLink("Back to List", "Index") %>
</div>

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>

它会生成html:

<!DOCTYPE html>

<html>
<head id="Head1"><title>

    RegisterUser1

</title><link href="../Content/Site.css" rel="stylesheet" type="text/css" />

    <script src="/Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>

    <!-- for Menu (Imp: jquery.js and menu.js must be included at last in links for menu effects to work.)-->
    <link href="../Content/menu.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery.js" type="text/javascript"></script>
    <script src="../../Scripts/menu.js" type="text/javascript"></script>
    <!--- for menu end -->

</head>
<body>
    <div class="page">
        <header>

            <table id="header">

                <tr>
                    <td>
                        <div id="aprica_logo">

                            <img src="../../Content/images/Apricalogo.png" alt="Aprica" style="width: 134px;
                                height: 100px;" />
                        </div>
                    </td>
                    <td>
                        <div align="center" id="title">
                            <h1>
                                Aprica</h1>
                        </div>
                    </td>
                    <td>
                        <div id="logindisplay">

        Welcome <strong>admin</strong>
        [ <a href="/CRMLogin/LogOff">Log Out</a> ]

                        </div>
                    </td>
                </tr>
            </table>
            <div id="menu">
                <ul class="menu">
                    <li><a href="#" class="parent"><span>My Account</span></a>
                        <div>
                            <ul>
                                <li><a href="#"><span>Change Password</span></a></li>
                                <li><a href="#"><span>Message Passing</span></a></li>
                                <li><a href="#"><span>Edit Profile</span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <a href="/CRMDashboard/Dashboard">
                            <span>Dashboard</span></a></li>
                    <li><a href="/CRM/Index" class="parent"><span>CRM Request</span></a>
                        <div>
                            <ul>
                                <li><a href="/CRM/AddNewCRM"><span>Add New CRM Request</span></a></li>
                                <li><a href="/CRM/ViewNewlyArrivedCRMRequest"><span>CRM Request List</span></a></li>
                                <li><a href="/CRM/NewOldDoctor"><span>CRM Doctors List</span></a></li>
                                <li><a href="/CRM/AddCRMDoctorBudget"><span>Add New CRM Doctor</span></a></li>
                                <li><a href="/CRM/UpdateCRMDoctorBudgetMain"><span>Edit CRM Doctor</span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li><a href="#" class="parent"><span>Reports</span></a>
                        <div>
                            <ul>
                                <li><a href="#" class="parent"><span>Chart Reports</span></a>
                                    <div>
                                        <ul>
                                            <li><a href="/ChartReport/Index"><span>CRM Request Reports</span></a>
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                                <li><a href="/Report/CRMStatus"><span>CRM Request Status</span></a></li>
                                <li><a href="/Report/DoctorReport"><span>Doctor wise</span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li><a href="#" class="parent"><span>Search</span></a>
                        <div>
                            <ul>
                                <li><a href="/Search/CRMIdIndex"><span>CRM Request Id Wise</span></a></li>
                                <li><a href="/Search/MDLNoIndex"><span>MDLNo Wise</span></a></li>
                                <li><a href="/Search/TerritoryIndex"><span>Territory Wise</span></a></li>
                                <li><a href="/Search/RequesterIndex"><span>TBM Wise</span></a></li>
                                <li><a href="/Search/PriorityIndex"><span>Priority Wise</span></a></li>
                                <li><a href="/Search/CRMStateIndex"><span>CRM State Wise</span></a></li>
                                <li><a href="/Search/ServiceStateIndex"><span>Service State Wise</span></a></li>
                            </ul>
                        </div>
                    </li>
                    <li><a href="/FilterCRMRequest/Index"><span>Filter CRM Requests</span></a></li>
                    <li><a href="#"><span>Settings</span></a></li>
                </ul>
            </div>
        </header>
        <section id="main">


<h2>RegisterUser1</h2>

<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>

<form action="/CRMLogin/RegisterUser1" method="post">
    <fieldset>
        <legend>User_Detail</legend>

        <div class="editor-label">
            <label for="Username">Username</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="The Username field is required." id="Username" name="Username" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Username" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="Password">Password</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line password" data-val="true" data-val-required="The Password field is required." id="Password" name="Password" type="password" value="" />
            <span class="field-validation-valid" data-valmsg-for="Password" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="Email_Add">Email address</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="The Email address field is required." id="Email_Add" name="Email_Add" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Email_Add" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="Alt_Email_Add">Alternate Email address</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="The Alternate Email address field is required." id="Alt_Email_Add" name="Alt_Email_Add" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Alt_Email_Add" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="ConfirmPassword">Confirm password</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line password" data-val="true" data-val-equalto="The password and confirmation password do not match." data-val-equalto-other="*.Password" id="ConfirmPassword" name="ConfirmPassword" type="password" value="" />
            <span class="field-validation-valid" data-valmsg-for="ConfirmPassword" data-valmsg-replace="true"></span>
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
</form>    

            <footer>
                <hr />
                <p>
                    Copyright (c) 2012</p>
                <hr />

            </footer>
        </section>
    </div>
</body>
</html>

2 个答案:

答案 0 :(得分:0)

我发生了类似性质的东西,我可以通过重新排序脚本来修复它。如果所有其他选项用完,您可以尝试此操作。

订单是

Jquery-yourversion.js
MicrosoftAjax.js
MicrosoftMvcAjax.js
MicrosoftMvcValidation.js
YourOtherScripts.js

我从另一个网络帖子中得到了这个提示,但现在找不到包含它的参考。如果这样有效,则归功于该帖子的作者。

希望这有助于你

答案 1 :(得分:0)

我遇到了客户端验证无法正常工作的问题。我在Chrome中启动了JavaScript控制台,看到我收到一条错误,指出“JQuery未定义。”。

原来我的View中有一些代码导致jQuery无法加载。

向遇到此问题的其他人推荐,在浏览器中检查您的JS控制台,以确保您没有收到JQuery错误。