ketyiaの学んだこと議事録

このサイトでは学んだことを記事にまとめていきます

ASP.NETについて勉強⑤ ~入力検証コントロール~

ASP.NETについて勉強⑤ ~入力検証コントロール~


こんばんは!
今、C#ASP.NETについて学んでいますので、アウトプットで記事にまとめていきます!!

今回は入力検証コントロールについてまとめていきます。

入力値の検証の目的


データの整合性

ユーザーからの入力は、アプリケーションのデータベースや内部システムに保存されることが多いです。不適切なデータが保存されると、データの整合性が損なわれ、システム全体の動作に影響を及ぼす可能性があります。入力値の検証により、データの整合性を保つことができます。

セキュリティ

不適切な入力(例えば、SQLインジェクション攻撃を試みる入力など)は、アプリケーションのセキュリティを脅かす可能性があります。入力値の検証は、これらのセキュリティリスクを軽減します。

ユーザーエクスペリエンス

入力値の検証は、ユーザーが間違ったデータを入力したときに、その早期発見と修正を可能にします。これにより、ユーザーエクスペリエンスが向上します。

ASP.NETにおけるユーザビリティの向上を目的としたユーザ入力値の検証


Webアプリケーションの開発において、ユーザビリティの向上は重要な目標の一つです。ASP.NETでは、ユーザビリティを向上させるための強力なツールとして、検証コントロール(Validation Control)、サマリ表示機能(Validation Summary)、一括結果チェック機能(Page.IsValidプロパティ)が提供されています。

検証コントロール(Validation Control)

検証コントロールは、ユーザーからの入力値を検証するためのASP.NETのコントロールです。これらのコントロールを使用すると、ユーザーがフォームに入力したデータが適切な形式と範囲であることを確認できます。

RequiredFieldValidator

このコントロールは、ユーザーが必須フィールドを空白にしないようにするためのものです。

RangeValidator

このコントロールは、ユーザーが入力する値が特定の範囲内にあることを確認します。

RegularExpressionValidator

このコントロールは、ユーザーの入力が特定の正規表現に一致することを確認します。

CompareValidator

このコントロールは、2つの入力値が一致することを確認します。

CustomValidator

このコントロールは、開発者が独自の検証ロジックを実装できるようにするためのものです。

サマリ表示機能(Validation Summary)

サマリ表示機能は、ページ上のすべての検証エラーを一覧表示するためのコントロールです。これにより、ユーザーは一度にすべてのエラーを確認し、それらを修正することができます。これは、ユーザビリティを大幅に向上させます。

サマリ表示機能の使用方法は、ValidationSummaryコントロールASP.NETのフォームに追加します。次に、そのコントロールのプロパティを設定して、どのようなエラーメッセージを表示するかを指定します。最後に、ユーザーがフォームを送信したときに、すべての検証エラーが一覧表示されるようにします。

一括結果チェック機能(Page.IsValidプロパティ)


Page.IsValidプロパティは、ページ上のすべての検証コントロールが成功したかどうかを示します。これを使用すると、開発者はユーザーがフォームを送信する前に、すべての入力が適切であることを確認できます。

一括結果チェック機能の使用方法は、ユーザーがフォームを送信したときにPage.IsValidプロパティをチェックします。このプロパティがtrueであれば、すべての検証が成功したことを意味します。このプロパティがfalseであれば、少なくとも1つの検証が失敗したことを意味します。この情報を使用して、開発者は適切なアクションを取ることができます。

実際にASP.NET Web Formsで試してみる


以下のようなコードを書いてみます

>|aspx| 
<%--
    FileName: test.aspx
    Created by: keita
  Created on: 2024.6

    Description: 
   入力検証コントロールの動作を試します
--%>

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

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ASP.NET Validation Example</title>
    <style>
        body {
            font-family: Arial, sans-serif;
        }
        .form-group {
            margin-bottom: 15px;
        }
        .error {
            color: red;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div class="form-group">
            <asp:Label ID="NameLabel" runat="server" Text="Name:"></asp:Label>
            <asp:TextBox ID="NameTextBox" runat="server"></asp:TextBox>
            <asp:RequiredFieldValidator ID="NameRequiredFieldValidator" runat="server" ControlToValidate="NameTextBox" ErrorMessage="Name is required." CssClass="error" />
        </div>
        <div class="form-group">
            <asp:Label ID="EmailLabel" runat="server" Text="Email:"></asp:Label>
            <asp:TextBox ID="EmailTextBox" runat="server"></asp:TextBox>
            <asp:RegularExpressionValidator ID="EmailRegularExpressionValidator" runat="server" ControlToValidate="EmailTextBox" ErrorMessage="Invalid email format." ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" CssClass="error" />
        </div>
        <div class="form-group">
            <asp:Button ID="SubmitButton" runat="server" Text="Submit" OnClick="SubmitButton_Click" />
        </div>
        <div class="form-group">
            <asp:ValidationSummary ID="ValidationSummary" runat="server" ShowSummary="true" ShowMessageBox="true" CssClass="error" />
        </div>
    </form>
</body>
</html>
||<

 

>|C#|
/*
 * FileName: test.aspx.cs
 * Created by: keita
 * Created on: 2024.6
 * 
 * Description: 
* 入力検証コントロール
*/
using System;

public partial class test : System.Web.UI.Page
{
   if (Page.IsValid)
  {
      Response.Write("データが正常に保存されました。");
  }
  else
  {
      Response.Write("入力にエラーがあります。すべてのフィールドを正しく入力してください。");
  }
}
||<


では実行してみましょう

 

 


このコードでは、Page.IsValidプロパティを使用して、すべての検証が成功したかどうかをチェックしています。すべての検証が成功した場合(つまり、ユーザーの入力がすべて適切である場合)、データをデータベースに保存し、成功メッセージを表示します。一部または全部の検証が失敗した場合(つまり、ユーザーの入力が一部または全部不適切である場合)、エラーメッセージを表示します。

入力検証はとても大切な要素で、色々な種類があることを学ぶことができました。

今日はここまでです♪
ここまで読んでいただきありがとうございます!