はじめに
以前、InputMan for Windows Forms 5.0Jの検証コントロールを使用して、Windowsフォームに入力データのエラーチェック機能を組み込む記事を紹介しました。
InputMan for ASP.NET 3.0Jは、このInputMan for Windows Forms 5.0JのASP.NETバージョンと言えるもので、同じようにWebページの入力フォームの入力内容をチェックできる5つの検証コントロールを持ったコンポーネントです。
今回は、この検証コントロールを使用し、入力エラーをチェックしてエラーメッセージを表示するWebページを作成してみました。
対象読者
Visual Basic/Visual C# 2008を使ってプログラムを作ったことのある人。
必要な環境
Visual Basic 2008、Visual C# 2008、Visual Studio 2008 SP1でプログラムが作れる環境、およびIISなどのASP.NETが動作できるWebサーバ。また、.NET Framework 3.5 SP1がインストールされていることが必須条件です。
なお、本プログラムはWindows Vista上で動作するVisual Studioを使用して作成し、IIS6.0 Webサーバ上でInternet Explorer 8を使って動作確認を行っています。
サンプルプログラム実行時の注意事項
Visual Studio 2008にInputMan for ASP.NET 3.0Jトライアル版をインストールし、ソースコード圧縮ファイル「myinput_vb_src.zip」または「myinput_cs_src.zip」を解凍して作成されるプロジェクトファイルをVisual Studioで開き、実行させてください。
コントロールのインストール
はじめてInputMan for ASP.NET 3.0Jを使用する方は、プロジェクトにInputMan for ASP.NET 3.0Jをインストールする必要があります。
インストーラは、グレープシティのWebページからユーザー情報を登録します。ダウンロード用のURLとトライアル版プロダクトキーが記載されているメールが送られてきますので、ここからダウンロードしてインストールしてください。ファイルはzip形式で圧縮されています。
制限事項などの詳細については、インストーラに同梱されているリリースノートを参照ください。
コントロールの追加
InputMan for ASP.NET 3.0Jをインストールしたら、ツールボックスに専用のタブを作成し、コントロールを追加します。追加するコントロールは、「.NET Frameworkコンポーネント」の「名前空間」が「GrapeCity.Web.Input」で始まる「Edit」「ForbiddenTextValidator」「TextLengthValidator」コントロールの3つです。
Webページの作成
今回作成するWebページは、次のような構成です。各コントロールのプロパティ設定は、このあとの記事の中で説明していきます。
InputMan for ASP.NET 3.0Jの概要とコントロールの設定 1
InputMan for ASP.NETは、11個の入力コントロールと、3つのエクステンダ、5つの検証コントロールから構成されています。入力コントロールは、いずれも標準コントロールの機能拡張版で、エクステンダは標準コントロールの機能拡張を行うコントロールです。そして、検証コントロールは入力コントロールの入力値をチェックするコントロールです。
今回は、入力コントロールからテキストコントロールを、検証コントロールから文字数検証と 禁止文字列コントロールを使用します。これらのコントロールの最大の特徴は、コードを一切書くことなく、プロパティの設定だけで入力値の制限やエラーチェックを行うことができるようになっている点です。
| 呼称 | 説明 |
|---|---|
| テキストコントロール | 入力可能な文字種を制限できるテキスト入力コントロール |
| マスクコントロール | 郵便番号などの入力に便利な書式設定機能をもったマスク入力コントロール |
| 日付コントロール | 日付と時刻の入力に特化した高機能の日付入力コントロール |
| 数値コントロール | さまざまな数値入力を細かく制御できる数値入力コントロール |
| コンボコントロール | 機能性とデザイン性に優れた高性能のマルチカラムコンボコントロール |
| リストコントロール | 機能性とデザイン性に優れた高性能のマルチカラムリストコントロール |
| カレンダーコントロール | スタイルを自由にカスタマイズできるカレンダー入力コントロール |
| 電卓コントロール | 四則演算とメモリ機能を備えた電卓入力コントロール |
| メッセージボックスコントロール | Javascriptでサポートされる3種のダイアログをサーバ側で表示するコントロール |
| ファンクションキーコントロール | ファンクションキーの動作を制御するキーフック用コントロール |
| リッチカレンダーコントロール | 高度なデザイン機能によるリッチな外観を備えたカレンダーコントロール |
| 呼称 | 説明 |
|---|---|
| バルーンチップエクステンダ | 視覚的にユーザーにメッセージを通知できるバルーンチップを表示 |
| ショートカットエクステンダ | Webフォーム上のコントロールにショートカット機能を提供 |
| 検証アクションエクステンダ | Webフォーム上の検証コントロールにさまざまなエラー通知方法を提供 |
| 呼称 | 説明 |
|---|---|
| 文字種検証コントロール | 指定した文字種以外の無効な入力がないかを検証するコントロール |
| 文字数検証コントロール | 入力された文字が最大文字数、最小文字数の範囲内にあるかどうかを検証するコントロール |
| 日付範囲検証コントロール | 入力された日付が指定した範囲内にあるかどうかを検証するコントロール |
| 日付比較検証コントロール | 基準となる日付の値もしくは2つの日付データの値を比較し日付の差を検証するコントロール |
| 禁止文字列検証コントロール | 指定した入力を禁止する文字列が入力されていないかどうかを検証するコントロール |
テキストコントロール（Editコントロール）の設定
テキスト（Edit）コントロールは、特定の文字種だけしか入力を受けつけないように入力文字に制限を加えることや、入力可能な文字種へ自動変換するオートコンバート機能、ドロップダウンエディットウィンドウによる入力、自動的に振り仮名を作成する機能など、Visual Studio標準のテキストボックスにはない高度な機能を提供します。
今回は、自動的に振り仮名を作成する機能と、入力書式を全角文字に設定することで半角の文字を自動的に全角に変換して入力するように設定します。
入力書式の設定は、配置したコントロールのスマートタグのタスクメニューから「書式を設定」を選びます。「テキストコントロールの書式設定」というダイアログボックスが表示されるので、ここで入力させたい書式を選びます。書式の詳細は別表の通りです。
このプログラムでは、3つのEditコントロールに、次のような書式を設定しています。
| コントロール | 設定値 | 内容 |
|---|---|---|
| Edit1 | Ｚ | 全角の文字だけを受けつけるようにする |
| Edit2 | Ｚ | 全角の文字だけを受けつけるようにする |
| Edit3 | 9 | 0～9の半角数字だけを受けつけるようにする |
AutoConvertプロパティをTrue（デフォルト）にすると、入力した文字列が設定した書式と違う場合は、自動的に設定した書式に変換されます。例えば、入力書式を大文字のアルファベットに設定した場合、小文字のアルファベットが入力されると自動的に大文字に変換されます。
また、自動的に振り仮名を作成するには、ReadingImeStringOutputオブジェクトのTargetControlプロパティで振り仮名を出力するコントロールを指定します。ここでは、Labelを出力先にします。そして、ReadingImeStringOutputオブジェクトのOutputModeプロパティで、ふりがなの出力テキストを既にコントロールに表示されているテキストの末尾に追加するか、既存テキストに上書きするかを設定できます。
ただし、このふりがな作成機能には、次のような制限事項がありますので注意してください。
- ［Enter］キーで確定前の入力文字を［BackSpace］キーで削除しても、ふりがなとして出力されてしまいます（これを防止する処理は別途自分で組み立てる必要があります）。
- クライアント側のスクリプト処理速度により、入力時のタイプスピードが速いとふりがなが正しく表示されない場合があります。
- Firefox 3.0は対応していません。Internet Explorer 6.0／7.0／8.0でのみ動作します。
| 全角 | 半角 | 説明 |
|---|---|---|
| Ａ | A | 大文字のアルファベット（A～Z） |
| ａ | a | 小文字のアルファベット（a～z） |
| Ｋ | K | カタカナ（促音・拗音の小書き表記あり） |
| ９ | 9 | 数字（0～9） |
| ＃ | # | 数字および数字関連記号（0～9、+ - $ % \ , .） |
| ＠ | @ | 記号 |
| Ｂ | B | ２進数（0または1） |
| Ｘ | X | 16進数（0～9、A～F） |
| Ｊ | - | ひらがな（促音・拗音の小書き表記あり） |
| Ｚ | - | 空白文字以外のすべての全角文字 |
| - | H | 空白文字以外のすべての半角文字 |
| Ｎ | N | カタカナ（促音・拗音の小書き表記なし） |
| Ｇ | - | ひらがな（促音・拗音の小書き表記なし） |
| - | ^ | 指定した書式に含まれないすべての文字 |
| Ｔ | - | サロゲート ペア文字 |
| Ｄ | - | 空白文字以外の２バイト文字(サロゲート ペア文字、空白文字を除いた全角文字) |
| Ｓ | S | 空白文字 |
InputMan for ASP.NET 3.0Jの概要とコントロールの設定 2
禁止文字列検証コントロール（ForbiddenTextValidatorコントロール）の設定
禁止文字列検証コントロール（ForbiddenTextValidatorコントロール）は、設定した文字列が入力されていないかどうかを検証するコントロールです。
ForbiddenTextValidatorクラスのForbiddenListプロパティで、入力禁止文字列の配列を設定します。ここで設定されたテキストが入力されると、ErrorMessageプロパティで設定したエラーメッセージテキストがForbiddenTextValidatorコントロールに表示されます。
禁止文字列は、プロパティウィンドウのForbiddenListプロパティをクリックするとエディタが起動しますので、ここに入力します。このプログラムでは、「販売促進一課」を「販促一課」などと部署名を省略形で入力されないように、ForbiddenTextValidatorコントロールでチェックするようにしました。
検証対象のコントロールは、ControlToValidateプロパティで設定します。プロパティウィンドウでこのプロパティをクリックすると、設定可能な入力コントロールがリスト表示されるので、リストの中から選びます。
エラーメッセージの文字列は、Fontプロパティを使って好きなフォントやサイズに変更できます。
文字数検証コントロール（TextLengthValidatorコントロール）の設定
TextLengthValidatorコントロールは、対象の入力コントロールに入力した文字数が、範囲内にあるかどうかを検証するコントロールです。
TextLengthValidatorクラスのMaximumLengthプロパティとMinimumLengthプロパティで、入力可能な文字数の範囲を指定します。対象の入力コントロール範囲外の文字数が入力されると、ErrorMessageプロパティで設定したエラーメッセージテキストが表示されます。
検証対象のコントロールは、同じくControlToValidateプロパティで設定します。このプログラムでは、5桁の数字以外はエラーになるように、MaximumLengthプロパティとMinimumLengthプロパティを「5」に設定しています。また、LengthAsByteプロパティを使用すると、入力可能な文字数をバイト単位か文字単位かを指定できます。
まとめ
Editコントロールを使うと、入力データに制限を加えることができるとともに、大文字小文字や全角半角などでは入力書式に自動的に変換させることができますので、入力時に希望した書式でデータを受け取ることができます。また、これでも防げない誤入力に対して、検証コントロールを使ってユーザーに入力ミスを伝えることができます。
入力チェックは常にプログラマの悩みの種で、結構労力を費やす処理でもあります。今回使用したこれらのコントロールは、コードを書くことなくプロパティの設定だけで処理を実行してくれますので、開発プロジェクトに活用してみてはいかがでしょうか。
製品情報
