ASP.NET快速入门教程:服务器控件窗体验证(1)

验证介绍

  Web 窗体框架包含一组验证服务器控件,这些控件提供易用但功能强大的方法 检查 输入窗体的错误,并在必要时向用户显示消息。

  验证控件像其他服务器控件一样添加到 Web 窗体页。有不同的控件用于特定的验证类型,如范围检查或模式匹配,以及确保用户不跳过输入字段的 RequiredFieldValidator。可以将多个验证控件附加到一个输入控件。例如,可以既指定需要输入,又指定输入必须包含特定范围的值。

  验证控件使用 HTML 和 Web 服务器控件的有限子集。对于每个控件,特定的属性包含要验证的值。下表列出了可以验证的输入控件。

  

控件 验证属性
HtmlInputText Value
HtmlTextArea Value
HtmlSelect Value
HtmlInputFile Value
TextBox Text
ListBox SelectedItem.Value
DropDownList SelectedItem.Value
RadioButtonList SelectedItem.Value

  验证控件类型

  最简单的验证形式是必需的字段。如果用户在字段中输入任何值,则字段有效。如果页中的所有字段都有效,则页有效。下面的示例使用 RequiredFieldValidator 阐释了这一点。

<html>
<head>
  <script language="C#" runat=server>
    void ValidateBtn_Click(Object Sender, EventArgs E) {
      if (Page.IsValid == true) {
       lblOutput.Text = "页有效!";
      }
      else {
       lblOutput.Text = "某些必需字段为空";
      }
    }
  </script>
</head>
<body>
<h3><font face="宋体">简单的 RequiredField 验证程序示例</font></h3>
<p>
<form runat="server">
  <table bgcolor="#eeeeee" cellpadding=10>
  <tr valign="top">
   <td colspan=3>
    <asp:Label ID="lblOutput" Text="请填写下面的必需字段" ForeColor="red" Font-Name="宋体" Font-Size="10" runat=server /><br>
   </td>
  </tr>
  <tr>
   <td colspan=3>
   <font face=宋体 size=2><b>信用卡信息</b></font>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>卡类型:</font>
   </td>
   <td>
    <ASP:RadioButtonList id=RadioButtonList1 RepeatLayout="Flow" runat=server>
      <asp:ListItem>MasterCard</asp:ListItem>
      <asp:ListItem>Visa</asp:ListItem>
    </ASP:RadioButtonList>
   </td>
   <td align=center rowspan=1>
    <asp:RequiredFieldValidator id="RequiredFieldValidator1"
      ControlToValidate="RadioButtonList1"
      Display="Static"
      InitialValue="" Width="100%" runat=server>
      *
    </asp:RequiredFieldValidator>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>卡号:</font>
   </td>
   <td>
    <ASP:TextBox id=TextBox1 runat=server />
   </td>
   <td>
    <asp:RequiredFieldValidator id="RequiredFieldValidator2"
      ControlToValidate="TextBox1"
      Display="Static"
      Width="100%" runat=server>
      *
    </asp:RequiredFieldValidator>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>截止日期:</font>
   </td>
   <td>
    <ASP:DropDownList id=DropDownList1 runat=server>
      <asp:ListItem></asp:ListItem>
      <asp:ListItem >06/00</asp:ListItem>
      <asp:ListItem >07/00</asp:ListItem>
      <asp:ListItem >08/00</asp:ListItem>
      <asp:ListItem >09/00</asp:ListItem>
      <asp:ListItem >10/00</asp:ListItem>
      <asp:ListItem >11/00</asp:ListItem>
      <asp:ListItem >01/01</asp:ListItem>
      <asp:ListItem >02/01</asp:ListItem>
      <asp:ListItem >03/01</asp:ListItem>
      <asp:ListItem >04/01</asp:ListItem>
      <asp:ListItem >05/01</asp:ListItem>
      <asp:ListItem >06/01</asp:ListItem>
      <asp:ListItem >07/01</asp:ListItem>
      <asp:ListItem >08/01</asp:ListItem>
      <asp:ListItem >09/01</asp:ListItem>
      <asp:ListItem >10/01</asp:ListItem>
      <asp:ListItem >11/01</asp:ListItem>
      <asp:ListItem >12/01</asp:ListItem>
    </ASP:DropDownList>
   </td>
   <td>
    <asp:RequiredFieldValidator id="RequiredFieldValidator3"
     ControlToValidate="DropDownList1"
     Display="Static"
     InitialValue="" Width="100%" runat=server>
     *
    </asp:RequiredFieldValidator>
   </td>
   <td>
  </tr>
  <tr>
   <td></td>
   <td>
    <ASP:Button id=Button1 text="验证" OnClick="ValidateBtn_Click" runat=server />
   </td>
   <td></td>
  </tr>
  </table>
</form>
</body>
</html>

  还有用于特定验证类型(如范围检查或模式匹配)的验证控件。下表列出了验证控件。

  

控件名称 说明
RequiredFieldValidator 确保用户不跳过输入。
CompareValidator 使用比较运算符(小于、等于、大于等)将用户的输入与另一控件的常数值或属性值进行比较。
RangeValidator 检查用户的输入是否在指定的上下边界之间。 可以检查数字、字母或日期对内的范围。可以将边界表示为常数。
RegularExpressionValidator 检查输入是否与正则表达式定义的模式匹配。该验证类型允许检查可预知的字符序列,如社会保障号、电子邮件地址、电话号码、邮政编码等中的字符序列。
CustomValidator 使用您自己编写的验证逻辑检查用户的输入。该验证类型允许检查运行时导出的值。
ValidationSummary 以摘要的形式 显示 页上所有验证程序的验证错误。

  客户端验证

  验证控件总是在服务器代码中执行验证检查。然而,如果用户使用的浏览器 支持 DHTML,则验证控件也可使用客户端脚本执行验证。在客户端验证中,当向服务器提交窗体时在客户端检测任何错误。如果发现任何验证程序有错误,将取消向服务器提交窗体,并显示验证程序的 Text 属性。这样可允许用户在向服务器提交窗体前更正输入。包含错误的字段一失去焦点,就立即重新验证字段值,从而为用户提供丰富的交互式验证体验。

  注意,Web 窗体页框架总是在服务器上执行验证,即使已经在客户端执行了验证。这有助于防止用户能够通过模拟另一用户或预获准的事务避开验证。

  默认情况下启用客户端验证。如果客户端可以,则将自动执行上层验证。若要禁用客户端验证,请将页的 ClientTarget 属性设置为“Downlevel”(“Uplevel”强制执行客户端验证)。

<%@ Page ClientTarget=UpLevel %>
<html>
<head>
  <script language="C#" runat=server>
    void Page_Load() {
      if (!IsPostBack) {
        // 进行初始验证,以便在第一个往返行程前强制显示 *s
        Validate();
      }
    }
    void ValidateBtn_Click(Object Sender, EventArgs E) {
      if (Page.IsValid == true) {
       lblOutput.Text = "页有效!";
      }
      else {
       lblOutput.Text = "某些必需字段为空";
      }
    }
  </script>
</head>
<body>
<h3><font face="宋体">客户端 RequiredFieldValidator 示例</font></h3>
<p>
<form runat="server">
  <table bgcolor="#eeeeee" cellpadding=10>
  <tr valign="top">
   <td colspan=3>
    <asp:Label ID="lblOutput" Name="lblOutput" Text="请填写下面的必需字段" ForeColor="red" Font-Name="宋体" Font-Size="10" runat=server /><br>
   </td>
  </tr>
  <tr>
   <td colspan=3>
   <font face=宋体 size=2><b>信用卡信息</b></font>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>卡类型:</font>
   </td>
   <td>
    <ASP:RadioButtonList id=RadioButtonList1 RepeatLayout="Flow" onclick="ClientOnChange();" runat=server>
      <asp:ListItem>MasterCard</asp:ListItem>
      <asp:ListItem>Visa</asp:ListItem>
    </ASP:RadioButtonList>
   </td>
   <td align=center rowspan=1>
    <asp:RequiredFieldValidator id="RequiredFieldValidator1" runat="server"
      ControlToValidate="RadioButtonList1"
      ErrorMessage="*"
      Display="Static"
      InitialValue=""
      Width="100%">
    </asp:RequiredFieldValidator>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>卡号:</font>
   </td>
   <td>
    <ASP:TextBox id=TextBox1 onchange="ClientOnChange();" runat=server />
   </td>
   <td>
    <asp:RequiredFieldValidator id="RequiredFieldValidator2" runat="server"
      ControlToValidate="TextBox1"
      ErrorMessage="*"
      Display="Static"
      Width="100%">
    </asp:RequiredFieldValidator>
   </td>
  </tr>
  <tr>
   <td align=right>
    <font face=宋体 size=2>截止日期:</font>
   </td>
   <td>
    <ASP:DropDownList id=DropDownList1 onchange="ClientOnChange();" runat=server>
      <asp:ListItem></asp:ListItem>
      <asp:ListItem >06/00</asp:ListItem>
      <asp:ListItem >07/00</asp:ListItem>
      <asp:ListItem >08/00</asp:ListItem>
      <asp:ListItem >09/00</asp:ListItem>
      <asp:ListItem >10/00</asp:ListItem>
      <asp:ListItem >11/00</asp:ListItem>
      <asp:ListItem >01/01</asp:ListItem>
      <asp:ListItem >02/01</asp:ListItem>
      <asp:ListItem >03/01</asp:ListItem>
      <asp:ListItem >04/01</asp:ListItem>
      <asp:ListItem >05/01</asp:ListItem>
      <asp:ListItem >06/01</asp:ListItem>
      <asp:ListItem >07/01</asp:ListItem>
      <asp:ListItem >08/01</asp:ListItem>
      <asp:ListItem >09/01</asp:ListItem>
      <asp:ListItem >10/01</asp:ListItem>
      <asp:ListItem >11/01</asp:ListItem>
      <asp:ListItem >12/01</asp:ListItem>
    </ASP:DropDownList>
   </td>
   <td>
    <asp:RequiredFieldValidator id="RequiredFieldValidator3" runat="server"
     ControlToValidate="DropDownList1"
     ErrorMessage="*"
     Display="Static"
     InitialValue=""
     Width="100%">
    </asp:RequiredFieldValidator>
   </td>
   <td>
  </tr>
  <tr>
   <td></td>
   <td>
    <ASP:Button id=Button1 text="验证" OnClick="ValidateBtn_Click" runat="server" />
   </td>
   <td></td>
  </tr>
  </table>
</form>
<script language=javascript>
<!--
  function ClientOnChange() {
    if (typeof(Page_Validators) == "未定义")
     return;
    document.all["lblOutput"].innerText = Page_IsValid ? "页有效!" : "某些必需字段为空";
  }
// -->
</script>
</body>
</html>

  显示验证错误

  在处理用户的输入时(如提交窗体时),Web 窗体页框架将用户的输入传递给关联的验证控件。验证控件测试用户的输入,并设置属性以指示输入是否通过了验证测试。处理完所有的验证控件后,将设置页上的 IsValid 属性。如果有任何控件显示验证检查失败,则整页设置为无效。

  如果验证控件有错误,错误信息可由该验证控件显示在页中,或者显示在页上其他地方的 ValidationSummary 控件中。当页的 IsValid 属性为 false 时,显示 ValidationSummary 控件。它轮询页上的每个验证控件,并聚合每个控件公开的文本消息。下面的示例阐释如何用 ValidationSummary 控件显示错误。

<%@ Page clienttarget=downlevel %>
<html>
<head>
  <script language="C#" runat=server>
    void ListFormat_SelectedIndexChanged(Object Sender, EventArgs E ) {
      // 当从“ListFormat”下拉列表中选择新选项时,
      // 更改验证程序摘要的显示模式
      valSum.DisplayMode = (ValidationSummaryDisplayMode) ListFormat.SelectedIndex;
    }
  </script>
</head>
<body>
<h3><font face="宋体">ValidationSummary 示例</font></h3>
<p>
<form runat="server">
<table cellpadding=10>
  <tr>
    <td>
      <table bgcolor="#eeeeee" cellpadding=10>
      <tr>
       <td colspan=3>
       <font face=宋体 size=2><b>信用卡信息</b></font>
       </td>
      </tr>
      <tr>
       <td align=right>
        <font face=宋体 size=2>卡类型:</font>
       </td>
       <td>
        <ASP:RadioButtonList id=RadioButtonList1 RepeatLayout="Flow" runat=server>
          <asp:ListItem>MasterCard</asp:ListItem>
          <asp:ListItem>Visa</asp:ListItem>
        </ASP:RadioButtonList>
       </td>
       <td align=center rowspan=1>
        <asp:RequiredFieldValidator id="RequiredFieldValidator1"
          ControlToValidate="RadioButtonList1"
          ErrorMessage="卡类型。"
          Display="Static"
          InitialValue="" Width="100%" runat=server>
          *
        </asp:RequiredFieldValidator>
       </td>
      </tr>
      <tr>
       <td align=right>
        <font face=宋体 size=2>卡号:</font>
       </td>
       <td>
        <ASP:TextBox id=TextBox1 runat=server />
       </td>
       <td>
        <asp:RequiredFieldValidator id="RequiredFieldValidator2"
          ControlToValidate="TextBox1"
          ErrorMessage="卡号。"
          Display="Static"
          Width="100%" runat=server>
          *
        </asp:RequiredFieldValidator>
       </td>
      </tr>
      <tr>
       <td align=right>
        <font face=宋体 size=2>到期日期:</font>
       </td>
       <td>
        <ASP:DropDownList id=DropDownList1 runat=server>
          <asp:ListItem></asp:ListItem>
          <asp:ListItem >06/00</asp:ListItem>
          <asp:ListItem >07/00</asp:ListItem>
          <asp:ListItem >08/00</asp:ListItem>
          <asp:ListItem >09/00</asp:ListItem>
          <asp:ListItem >10/00</asp:ListItem>
          <asp:ListItem >11/00</asp:ListItem>
          <asp:ListItem >01/01</asp:ListItem>
          <asp:ListItem >02/01</asp:ListItem>
          <asp:ListItem >03/01</asp:ListItem>
          <asp:ListItem >04/01</asp:ListItem>
          <asp:ListItem >05/01</asp:ListItem>
          <asp:ListItem >06/01</asp:ListItem>
          <asp:ListItem >07/01</asp:ListItem>
          <asp:ListItem >08/01</asp:ListItem>
          <asp:ListItem >09/01</asp:ListItem>
          <asp:ListItem >10/01</asp:ListItem>
          <asp:ListItem >11/01</asp:ListItem>
          <asp:ListItem >12/01</asp:ListItem>
        </ASP:DropDownList>
       </td>
       <td>
        <asp:RequiredFieldValidator id="RequiredFieldValidator3"
         ControlToValidate="DropDownList1"
         ErrorMessage="失效日期。"
         Display="Static"
         InitialValue=""
         Width="100%"
         runat=server>
         *
        </asp:RequiredFieldValidator>
       </td>
       <td>
      </tr>
      <tr>
       <td></td>
       <td>
        <ASP:Button id=Button1 text="验证" runat=server />
       </td>
       <td></td>
      </tr>
      </table>
    </td>
    <td valign=top>
      <table cellpadding=20><tr><td>
      <asp:ValidationSummary ID="valSum" runat="server"
        HeaderText="必须在下列字段中输入值:"
        Font-Name="verdana"
        Font-Size="12"
        />
      </td></tr></table>
    </td>
  </tr>
</table>
<font face="宋体" size="-1">选择所需的验证摘要显示类型:</font>
<asp:DropDownList id="ListFormat" AutoPostBack=true OnSelectedIndexChanged="ListFormat_SelectedIndexChanged" runat=server >
  <asp:ListItem>列表</asp:ListItem>
  <asp:ListItem selected> 项目 符号列表</asp:ListItem>
  <asp:ListItem>单独一段</asp:ListItem>
</asp:DropDownList>
</form>
</body>
</html>

  使用 CompareValidator

  CompareValidator 服务器控件比较两个控件的值。CompareValidator 使用三个键属性执行验证。ControlToValidate 和 ControlToCompare 包含要比较的值。Operator 定义要执行的比较类型,例如 Equal 或 Not Equal。CompareValidator 通过将这些属性计算为表达式来执行验证,如下所示:

( ControlToValidate <Operator> ControlToCompare )

  如果表达式计算为真,则验证结果有效。

  下面的示例显示如何使用 CompareValidator 控件。

<%@ Page clienttarget=downlevel %>
<html>
<head>
  <script language="VB" runat="server">
    Sub Button1_OnSubmit(sender As Object, e As EventArgs)
      If (Page.IsValid) Then
       lblOutput.Text = "结果:有效!"
      Else
       lblOutput.Text = "结果:无效!"
      End If
    End Sub
    Sub lstOperator_SelectedIndexChanged(sender As Object, e As EventArgs)
      comp1.Operator = lstOperator.SelectedIndex
      comp1.Validate
    End Sub
  </script>
</head>
<body>
  <h3><font face="宋体">CompareValidator 示例</font></h3>
  <p>在每个文本框中键入一个值,选择一个比较运算符,然后单击“验证”进行测试。</p>
  <form runat=server>
   <table bgcolor="#eeeeee" cellpadding=10>
   <tr valign="top">
    <td>
      <h5><font face="宋体">字符串 1:</font></h5>
      <asp:TextBox id="txtComp" runat="server"></asp:TextBox>
    </td>
    <td>
      <h5><font face="宋体">比较运算符:</font></h5>
      <asp:ListBox id="lstOperator" OnSelectedIndexChanged="lstOperator_SelectedIndexChanged" runat="server">
          <asp:ListItem Selected Value="Equal" >Equal</asp:ListItem>
          <asp:ListItem Value="NotEqual" >NotEqual</asp:ListItem>
          <asp:ListItem Value="GreaterThan" >GreaterThan</asp:ListItem>
          <asp:ListItem Value="GreaterThanEqual" >GreaterThanEqual</asp:ListItem>
          <asp:ListItem Value="LessThan" >LessThan</asp:ListItem>
          <asp:ListItem Value="LessThanEqual" >LessThanEqual</asp:ListItem>
      </asp:ListBox>
    </td>
    <td>
      <h5><font face="宋体">字符串 2:</font></h5>
      <asp:TextBox id="txtCompTo" runat="server"></asp:TextBox><p>
      <asp:Button runat=server Text="验证" ID="Button1" onclick="Button1_OnSubmit" />
    </td>
   </tr>
   </table>
   <asp:CompareValidator id="comp1" ControlToValidate="txtComp" ControlToCompare = "txtCompTo" Type="String" runat="server"/>
   <br>
   <asp:Label ID="lblOutput" Font-Name="宋体" Font-Size="10.5pt" runat="server"/>
  </form>
</body>
</html>

你可能感兴趣的:(asp.net)