Tweet

.NET TIPS ［ASP.NET AJAX］MaskedEditValidatorコントロールでマスク機能付きテキストボックスへの入力値を検証するには？［2.0、3.0、3.5、C#、VB］ 山田 祥寛 2008/08/21

　「TIPS：［ASP.NET AJAX］MaskedEditコントロールでテキストボックスに入力可能な値を制限するには？」で紹介したように、MaskedEditコントロールは、厳密にはテキストボックスへの入力を制限する機能を持つMaskedEditExtenderと、マスクで入力制限されたテキストボックスの妥当性を検証するMaskedEditValidatorとから構成される。

　本稿では、以降、エクステンダ・コントロールの側を単にMaskedEditコントロールと、検証コントロールの側をMaskedEditValidatorコントロールと表記し、区別するものとする。

　前掲のTIPSでは、取りあえずMaskedEditコントロールだけを利用してマスク機能付きテキストボックスを作成してみたわけであるが、実際のアプリケーションではマスク機能だけでは十分とはいえない。マスク機能はブラウザのJavaScript機能をオフにされてしまえば無効になってしまうし、そもそもマスク機能とはただ単に入力可能な文字列の最小公倍数を定義するもので、厳密にアプリケーションとして妥当な値を定義するものではない。

　例えば、前掲のTIPSでRGB形式のカラーコードとして「#99」のような値を入力してもマスク機能は受け入れてしまうし（マスクはあくまで最大6桁の数値とA〜F文字の組み合わせを受け入れることを定義しているにすぎないからだ）、金額として入力可能な数値範囲を指定することはできない。

　そこで登場するのが、MaskedEditValidatorコントロールだ。

　MaskedEditValidatorコントロールは、MaskedEditコントロールとの組み合わせで利用することを想定した検証コントロールで、MaskedEditコントロールで指定されたルールに従って検証を行い、検証エラー時にはエラー・メッセージを表示する。検証コントロールの基底クラスであるBaseValidatorクラスを継承しているので、標準の検証クラスと同様の手順で利用でき、（もちろん）ValidationSummaryコントロールとも連動できるのが特徴だ。

　検証コントロールに関する詳細は、「テンプレート機能でGridViewコントロールも自由自在」などを参照していただきたい。

MaskedEditValidatorコントロールによる入力値の検証

テキストボックスに入力された値が妥当でない場合には、エラー・メッセージを表示する。

　それではさっそく、MaskedEditValidatorコントロールを利用して、上の画面のような検証機能をページに付与してみることにしよう。なお、本サンプルを作成するに当たっては、前掲のTIPSにあるMaskedEdit.aspxをベースにしている。MaskedEditコントロールで利用可能なプロパティなども含め、MaskedEdit.aspxについての詳細はそちらで確認していただきたい。

1. サーバ・コントロールを配置する

　既存のMaskedEdit.aspxに対して、フォーム・デザイナから以下の画面の要領でサーバ・コントロールを配置する。

Webフォーム（MaskedEdit.aspx）のフォーム・レイアウト

既存のMaskedEdit.aspxに対して以下のコントロールを配置する。

MaskedEditValidatorコントロール（mevDateTime）。   MaskedEditValidatorコントロール（mevMoney）。   MaskedEditValidatorコントロール（mevRgb）。   Buttonコントロール（btnSend）。   ValidationSummaryコントロール（summary）。

　MaskedEditValidatorコントロールは、検証コントロールの一種で、標準的なRequiedFieldValidatorやRangeValidatorとほぼ同じ要領で利用できるのが特徴である。が、一点だけ、その性質上、必ずMaskedEditValidatorコントロールはMaskedEditコントロールとセットでなければ利用できない点に注意。MaskedEditコントロールはそれ単体で利用できるが、MaskedEditValidatorコントロールは単体では利用できない。

2. コントロールのプロパティ情報を設定する

　次に、ページに配置したサーバ・コントロールのプロパティを以下の表の要領で設定する（MaskedEditコントロールについては、前回の設定からの差分のみを示している）。

コントロール（ID）	プロパティ	設定値
MaskedEditExtender（meeDateTime）	ErrorTooltipEnabled	True
MaskedEditValidator（mevDateTime）	ControlExtender	meeDateTime
	ControlToValidate	txtTime
	EmptyValueBlurredText	*
	EmptyValueMessage	日時は必ず入力してください。
	InvalidValueBlurredMessage	*
	InvalidValueMessage	日時を正しい形式で入力してください。
	IsValidEmpty	False
	SetFocusOnError	True
MaskedEditExtender（meeMoney）	ErrorTooltipEnabled	True
MaskedEditValidator（mevMoney）	ControlExtender	meeMoney
	ControlToValidate	txtMoney
	MaximumValue	8000
	MaximumValueBlurredMessage	*
	MaximumValueMessage	金額は8000円以下で入力してください。
	MinimumValue	500
	MinimumValueBlurredText	*
	MinimumValueMessage	金額は500円以上で入力してください。
	SetFocusOnError	True
MaskedEditExtender（meeRgb）	ErrorTooltipEnabled	True
	MessageValidateTip	True
MaskedEditValidator（mevRgb）	ControlExtender	meeRgb
	ControlToValidate	txtRgb
	InvalidValueBlurredMessage	*
	InvalidValueMessage	RGB色は#999999の形式で入力してください。
	ValidationExpression	#[0-9A-Fa-f]{6}
	ToolTipMessage	0〜9、A〜Fのみ使用可
Button（btnSend）	Text	送信
ValidationSummary（summary）	ShowMessageBox	True
	ShowSummary	False
Webフォーム（MaskedEdit.aspx）のプロパティ設定（差分のみ）

　MaskedEditValidatorコントロールでは、検証コントロールで共通して利用可能なプロパティのほか、以下のようなプロパティを設定することが可能だ（共通プロパティについては、先述の別稿を参照）。

分類	プロパティ名	概要
基本	ControlToValidate	検証対象となるテキストボックスのID値
	ControlExtender	テキストボックスに適用されたMaskedEditコントロールのID値
検証パラメータ	InitialValue	テキストボックスの初期値（必須検証に使用）
	IsValidEmpty	テキストボックスが空であることを許可するか
	MaximumValue	許可する最大値
	MinimumValue	許可する最小値
	ValidationExpression	入力値の検証に使用する正規表現パターン
	ClientValidationFunction	カスタムの検証ロジックを規定するJavaScript関数
メッセージ	EmptyValueMessage	入力値が空の場合のメッセージ（フォーカス時）
	EmptyValueBlurredText	入力値が空の場合のメッセージ（フォーカス喪失時）
	InvalidValueMessage	入力値が不正の場合のメッセージ（フォーカス時）
	InvalidValueBlurredMessage	入力値が不正の場合のメッセージ（フォーカス喪失時）
	MaximumValueMessage	入力値が最大値を超えている場合のメッセージ（フォーカス時）
	MaximumValueBlurredMessage	入力値が最大値を超えている場合のメッセージ（フォーカス喪失時）
	MinimumValueMessage	入力値が最小値未満である場合のメッセージ（フォーカス時）
	MinimumValueBlurredText	入力値が最小値未満である場合のメッセージ（フォーカス喪失時）
その他	TooltipMessage	空のテキストボックスにフォーカスを当てた場合に表示されるツールヒント
MaskedEditValidatorコントロールで利用可能な主なプロパティ

　多くのプロパティが用意されているが、まず、ControlToValidate／ControleExtenderプロパティは必須である。それ以外は、適用する検証に応じて、必要なパラメータと対応するメッセージとをそれぞれ設定する必要がある。

　メッセージは、大きくXxxxxMessageプロパティとXxxxxBlurredText（Message）プロパティのパターンに分類できるが、まず後者は、標準的な検証コントロールのTextプロパティに相当するものだと考えればよいだろう。つまり、検証エラー時に検証コントロールの場所に表示されるテキストを指定するものだ。省略された場合には、対応するXxxxxMessageプロパティの値が使用される。

　XxxxxBlurredTextプロパティには（もちろん）具体的なエラー・メッセージを指定しても構わないが、ValidationSummaryコントロールを使用している場合には、エラー個所を表すための印（本サンプルでは「*」）だけを指定しておくのが一般的だろう。

　一方、XxxxxMessageプロパティは、標準的な検証コントロールのErrorMessageプロパティに相当するものだ。ValidationSummaryコントロールに引き渡されるエラー・メッセージを表すとともに、MaskedEditコントロールのErrorTooltipEnabledプロパティが指定された場合には、テキストボックスにマウス・カーソルを当てることでエラー・メッセージをツールチップとして表示することも可能である。

MaskedEdit.ErrorTooltipEnabledプロパティがTrueの場合

マウス・カーソルをコントロール上に移動させると、エラー・メッセージがツールチップとして表示される。

　また、TooltipMessageプロパティにも注目だ。こちらは、空のテキストボックスにフォーカスしたときに表示されるテキストを表すものだ。ツールチップは、MaskedEdit.MessageValidateTipプロパティがTrueである場合にのみ表示される。

テキストボックスにフォーカス時に入力ヒントが表示される

　以上で、MaskedEditValidatorコントロールを利用するための手続きは完了だ。作成したサンプル・プログラムを実行し、冒頭の画面のように、不正な値を入力したときにエラー・ ダイアログが表示されればMaskedEditValidatorコントロールは正しく動作している。

この記事と関連性の高い別の.NET TIPS ［ASP.NET AJAX］MaskedEditコントロールでテキストボックスに入力可能な値を制限するには？ ［ASP.NET］CustomValidatorコントロールでマスタ重複チェックを実装するには？ ［ASP.NET］複数のボタンを持つフォームで検証コントロールを利用するには？ ［ASP.NET AJAX］ValidatorCalloutコントロールで検証メッセージをバルーン表示するには？ ［ASP.NET］CustomValidatorコントロールでクライアント検証を有効にするには？ このリストは、（株）デジタルアドバンテージが開発した 自動関連記事探索システム Jigsaw（ジグソー） により自動抽出したものです。 generated by

「.NET TIPS」

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）