标记ASP.net验证器

时间:2014-11-27 11:46:55

标签: javascript jquery html asp.net servercontrols

我使用ASP.net(Vs2013)中的设计器创建了一个简单的webform。该系统确实运行良好,我只需要使用工具箱中的一些文本框和自定义验证控件。如果输入正确,表单将检查客户端,如果没有则显示错误消息。

然而,错误消息只会在丑陋的红色文本atm中显示在页面上。我非常希望标记这个错误消息,例如在错误上使用Jquery淡入功能,或者使用任何自定义的javascript来挂钩这个来自ASP的js。

最好的方法是什么,在哪里才能做到这一点?

代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="registreren.aspx.cs" Inherits="registreren" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script type="text/javascript" src="scripts/jquery.js"></script> 

    <title></title>
    <link href="WebsiteStyle.css" type="text/css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <div style="height: 244px">

        <table class="auto-style1">
            <tr>
                <td class="auto-style2" rowspan="1">Username</td>
                <td class="auto-style7" rowspan="1">
                    <asp:TextBox ID="TextBoxUsername" runat="server" Width="240px"></asp:TextBox>
                </td>
                <td rowspan="1">
                    <asp:RequiredFieldValidator ID="RequiredUsername" runat="server" ControlToValidate="TextBoxUsername" ErrorMessage="Please enter an username." CssClass="validationError"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3" rowspan="1">Email</td>
                <td class="auto-style6" rowspan="1">
                    <asp:TextBox ID="TextBoxEmail" runat="server" Width="240px"></asp:TextBox>
                </td>
                <td class="auto-style4" rowspan="1">
                    <asp:RequiredFieldValidator ID="RequiredEmail" runat="server" ControlToValidate="TextBoxEmail" ErrorMessage="Please enter your emailaddress." CssClass="validationError"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style2" rowspan="1">Password</td>
                <td class="auto-style7" rowspan="1">
                    <asp:TextBox ID="TextBoxPassword" runat="server" Width="240px" TextMode="Password"></asp:TextBox>
                </td>
                <td rowspan="1">
                    <asp:RequiredFieldValidator ID="RequiredPassword" runat="server" ControlToValidate="TextBoxPassword" ErrorMessage="Please enter a password." CssClass="validationError"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style2" rowspan="1">Confirm Password</td>
                <td class="auto-style7" rowspan="1">
                    <asp:TextBox ID="TextBoxConfirmPassword" runat="server" Width="240px" TextMode="Password"></asp:TextBox>
                </td>
                <td rowspan="1">

                    <asp:CustomValidator ID="RequiredConfirmPassword" runat="server" ControlToValidate="TextBoxConfirmPassword" ErrorMessage="Please confirm the password." ClientValidationFunction="validateConfirmPassword" ValidateEmptyText="True" CssClass="validationError"></asp:CustomValidator>

                        </td>
            </tr>
            <tr>
                <td class="auto-style2" rowspan="1">Country</td>
                <td class="auto-style7" rowspan="1">
                    <asp:DropDownList ID="DropDownListSelectCountry" runat="server" Height="16px" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" Width="240px">
                        <asp:ListItem>Select country</asp:ListItem>
                        <asp:ListItem>The Netherlands</asp:ListItem>
                        <asp:ListItem>Belgium</asp:ListItem>
                        <asp:ListItem>France</asp:ListItem>
                        <asp:ListItem>Germany</asp:ListItem>
                    </asp:DropDownList>
                </td>
                <td rowspan="1">
                    <asp:RequiredFieldValidator ID="RequiredCountry" runat="server" ControlToValidate="DropDownListSelectCountry" ErrorMessage="Please select a country." InitialValue="Select country" CssClass="validationError"></asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style2" rowspan="1">&nbsp;</td>
                <td class="auto-style7" rowspan="1">
                    <asp:Button ID="submit" runat="server" Text="Button" />
                </td>
                <td rowspan="1">&nbsp;</td>
            </tr>
        </table>

    </div>
    </form>

         <script type="text/javascript" src="scripts/customScripts.js"></script>

</body>

</html>

0 个答案:

没有答案