jquery验证不在内容占位符中工作

时间:2017-01-05 12:09:03

标签: javascript jquery asp.net jquery-validate

我正在尝试对我的asp页面使用jquery验证。我已经通过nuget包下载了所有必需的js文件。请参阅附图。 我按照http://www.dotnetcurry.com/ShowArticle.aspx?ID=310&AspxAutoDetectCookieSupport=1中提供的教程进行操作 并尝试了一些简单的验证,但它无法正常工作。

我尝试在firefox和chrome中打开我的页面并检查控制台错误。在浏览器的控制台中没有显示错误,但我也没有得到任何结果。我无法确定我的流程或代码有什么错误。 我的代码::

// master page
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Global.master.cs" Inherits="MIS.content.Global" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script type="text/javascript" src="../Scripts/jquery-3.1.1.min.js"></script>    
    <script type="text/javascript" src="../Scripts/jquery.validate.min.js"></script>
    <script type="text/javascript" src="../Scripts/jquery.validation.net.webforms.min.js"></script>

    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <div id="container">
            <div id="tray">
                testing
            </div>
            <div id="cols">
                <div id="aside">                    
                </div>
                <div id="content">
                    <div id="main_content">                        
                        <div>
                            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                            </asp:ContentPlaceHolder>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </form>
</body>
</html>

aspx页面

<%@ Page Language="C#" MasterPageFile="Global.master" AutoEventWireup="true" CodeBehind="CustomerRegistration.aspx.cs" Inherits="MIS.content.CustomerRegistration" %>

<asp:Content ID="UserContent" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">   
    <script type="text/javascript">
        $(document).ready(function() {
            $("#aspnetForm").validate({
                rules: {
                    <%=txt_name.UniqueID %>: {
                        minlength: 2,
                        required: true
                    },
                    <%=txt_gender.UniqueID %>: {                       
                        required: true,
                        email:true
                    }
                }, messages: {}
            });
        });
    </script>
    <div style="width: 100%; font-family: Arial,Helvetica, sans-serif;">
        <div style="text-align: left; width: 100%; font-size: 13px; margin-bottom: 5px;">
            <b>Name :</b>
            <asp:textbox id="txt_name" runat="server" />
        </div>
        <div style="text-align: left; width: 100%; font-size: 13px; margin-bottom: 5px;">
            <b>Gender :</b>
            <asp:textbox id="txt_gender" runat="server" />
        </div>
        <div style="text-align: left; width: 100%; font-size: 13px; margin-bottom: 5px;">
            <asp:button id="btnSubmit" runat="server" text="Submit" />
        </div>
    </div>
</asp:Content>

enter image description here

1 个答案:

答案 0 :(得分:1)

更改

$("#aspnetForm").validate({

$("#form1").validate({

在您提供的the link中,已为ID #formmaster激活验证。在他们的剪辑中,ID formmaster用作<form>代码的ID:<form id="formmaster" runat="server">

并检查验证是否需要字段名称或ID。大多数时候它使用ID。因此,您可能需要将<%=txt_name.UniqueID %>更改为<%=txt_name.ClientID %>