Flex で検証イベントを受け取る方法は、2 とおりあります。
Flex コンポーネントは、検証結果に応じて、valid イベントまたは invalid イベントを送出します。これによって、検証対象のコンポーネントから送出されたイベントを受け取り、その検証結果に基づいてコンポーネントに対して追加の処理を実行できます。
イベントリスナーに渡されるイベントオブジェクトは、Event タイプです。例を含む詳細については、コンポーネントの検証イベントの明示的な処理を参照してください。
バリデータはすべて、検証結果に応じて、valid イベントまたは invalid イベントを送出します。これらのイベントを受け取り、その後、バリデータの必要に応じて追加の処理を実行できます。
イベントリスナーに渡されるイベントオブジェクトは、ValidationResultEvent タイプです。例を含む詳細については、バリデータの検証イベントの明示的な処理を参照してください。
検証イベントを受け取る必要はありません。これらのイベントが発行されると、デフォルトでは、Flex は対象のコンポーネントの境界線色を適切な色に変更し、invalid イベントに対してエラーメッセージを表示するか、valid イベントに対して前のエラーメッセージを非表示にします。
検証が失敗したか成功したかによって、コンポーネントに追加の処理を実行することができます。その場合、valid イベントと invalid イベントを任意で処理することができます。次の例では、検証が失敗した場合に追加処理を実行するために、invalid イベントのイベントリスナーを定義します。
<?xml version="1.0"?>
<!-- validators\ValCustomEventListener -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
// Import event class.
import flash.events.Event;
// Define vars for storing text colors.
private var errorTextColor:Object = "red";
private var currentTextColor:Object;
// Initialization event handler for getting default text color.
private function myCreationComplete(eventObj:Event):void {
currentTextColor = getStyle('color');
}
// For an invalid event, change the text color.
private function handleInvalidVal(eventObject:Event):void {
setStyle('color', errorTextColor);
}
// For a valid event, restore the text color.
private function handleValidVal(eventObject:Event):void {
setStyle('color', currentTextColor);
}
]]>
</mx:Script>
<mx:PhoneNumberValidator source="{phoneInput}" property="text"/>
<mx:TextInput id="phoneInput"
initialize="myCreationComplete(event);"
invalid="handleInvalidVal(event);"
valid="handleValidVal(event);"/>
<mx:TextInput id="zipInput"/>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。
バリデータによって送出された valid イベントおよび invalid イベントを明示的に処理するには、次の例に示すように、イベントリスナーを定義します。
<?xml version="1.0"?>
<!-- validators\ValEventListener.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
// Import event class
import mx.events.ValidationResultEvent;
private function handleValid(event:ValidationResultEvent):void {
if(event.type==ValidationResultEvent.VALID)
submitButton.enabled = true;
else
submitButton.enabled = false;
}
// Submit form is everything is valid.
private function submitForm():void {
// Handle submit.
}
]]>
</mx:Script>
<mx:ZipCodeValidator
source="{inputZip}" property="text"
valid="handleValid(event);"
invalid="handleValid(event);"/>
<mx:TextInput id="inputZip"/>
<mx:TextInput id="inputPn"/>
<mx:Button id="submitButton"
label="Submit"
enabled="false"
click="submitForm();"/>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。
この例では、TextInput フィールドに有効な郵便番号が入力されない限り、Button コントロールは有効になりません。イベントオブジェクトの type プロパティは、検証結果に基づいて、ValidationResultEvent.VALID または ValidationResultEvent.INVALID のいずれかになります。
イベントリスナー内では、ValidationResultEvent クラスのすべてのプロパティを使用できます。これには次のようなプロパティがあります。
field
検証に失敗しイベントをトリガしたフィールドの名前を示すストリング。
message
検証によって作成されたすべてのバリデータエラーメッセージを含むストリング。
results
検証されたフィールドごとに ValidationResult オブジェクトを 1 つずつ含む配列。検証が成功した場合、ValidationResultEvent.results Array プロパティは空になります。検証に失敗した場合、ValidationResultEvent.results Array プロパティには、バリデータがチェックしたフィールド(検証に失敗したフィールドと合格したフィールドの両方)ごとに 1 つずつの ValidationResult オブジェクトが含まれます。ValidationResult.isError プロパティを調べれば、フィールドが検証に合格したか失敗したかを判別できます。
このページに新しいコメントが追加された場合に、電子メールでの通知を希望する。 | コメントレポート