検証の一般的なガイドライン -- Flex 2.01

フォーム上で検証を実行するときには、いくつかのガイドラインに従う必要があります。通常、フォームはデータモデルに関連付けます。そのようにすることで、入力ユーザーインターフェイスコントロールをデータモデルのフィールドにバインディングする一部として検証をトリガできます。また、次のアクションを実行することもできます。

次の例では、これらのガイドラインに従い、複数の TextInput コントロールで構成されたフォームを検証します。

<?xml version="1.0"?>
<!-- validators\FullApp.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> 

    <mx:Script>
        <![CDATA[
            import mx.events.ValidationResultEvent;

            private var vResult:ValidationResultEvent;

            // Function to validate data and submit it to the server. 
            private function validateAndSubmit():void           {
                // Validate the required fields. 
                vResult = fNameV.validate();
                if (vResult.type==ValidationResultEvent.INVALID) 
                    return;
        
                vResult = lNameV.validate();
                if (vResult.type==ValidationResultEvent.INVALID) 
                    return;

                // Since the date requires 3 fields, perform the validation 
                // when the Submit button is clicked. 
                vResult = dayV.validate();
                if (vResult.type==ValidationResultEvent.INVALID) 
                    return;
    
                // Invoke any other validators or validation logic to make
                // an additional check before submitting the data.

                // Submit data to server.
            }
        ]]>
    </mx:Script>

    <!-- Define the data model. -->
    <mx:Model id="formInfo">
        <formData>
            <date>
                <month>{monthInput.text}</month>
                <day>{dayInput.text}</day>
                <year>{yearInput.text}</year>
            </date>
            <name>
                <firstName>{fNameInput.text}</firstName>
                <lastName>{lNameInput.text}</lastName>
            </name>
            <phoneNum>{phoneInput.text}</phoneNum>
        </formData>
    </mx:Model>

    <!-- Define the validators. -->
    <mx:StringValidator id="fNameV" 
        required="true"
        source="{fNameInput}" 
        property="text"/>
    <mx:StringValidator id="lNameV" 
        required="true" 
        source="{lNameInput}" 
        property="text"/>
    <mx:PhoneNumberValidator id="pnV"
        source="{phoneInput}" 
        property="text"/>

    <!-- Invoke the DataValidator programmatically. -->
    <mx:DateValidator id="dayV" 
        triggerEvent="" 
        daySource="{dayInput}" dayProperty="text" 
        monthSource="{monthInput}" monthProperty="text" 
        yearSource="{yearInput}" yearProperty="text"/>

    <!-- Define the form to populate the model. -->
    <mx:Form>
        <mx:FormItem label="Month">
            <mx:TextInput id="monthInput"/>
        </mx:FormItem>
        <mx:FormItem label="Day">
            <mx:TextInput id="dayInput"/>
        </mx:FormItem>
        <mx:FormItem label="Year">
            <mx:TextInput id="yearInput"/>
        </mx:FormItem>
        <mx:FormItem label="First name">
            <mx:TextInput id="fNameInput"/>
        </mx:FormItem>
        <mx:FormItem label="Last name">
            <mx:TextInput id="lNameInput"/>
        </mx:FormItem>
        <mx:FormItem label="Phone">
            <mx:TextInput id="phoneInput"/>
        </mx:FormItem>
    </mx:Form>

    <!-- Define the button to trigger validation. -->
    <mx:Button label="Submit"
        click="validateAndSubmit();"/>
</mx:Application>