ASP.NETクイックスタートチュートリアル:サーバコントロールフォーム検証(1)

21480 ワード

検証の概要
Webフォームフレームワークには、使いやすいが機能的な方法を提供する検証サーバコントロールのセットが含まれています.
けんさ
フォームのエラーを入力し、必要に応じてユーザーにメッセージを表示します.
認証コントロールは、他のサーバーコントロールのようにWebフォームページに追加されます.範囲チェックやパターンマッチングなど、特定の検証タイプのコントロールや、入力フィールドのRequiredFieldValidatorをスキップしないことを確認します.複数の検証コントロールを1つの入力コントロールに追加できます.たとえば、入力する必要があることを指定したり、入力に特定の範囲の値を含める必要があることを指定したりできます.
検証コントロールは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サーバコントロールは、2つのコントロールの値を比較します.CompareValidatorは、3つのキー属性を使用して検証を行います.ControlToValidateとControlToCompareには、比較する値が含まれます.Operatorは、EqualまたはNot Equalなどの実行する比較タイプを定義します.CompareValidatorは、これらの属性を式として計算することによって検証を行います(ControlToValidateControlToCompare)
式が真に計算された場合、検証結果は有効です.
次の例では、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>