Adobe Flex 3 ヘルプ

例:複数のフィールドの検証

バリデータは、一度に複数のフィールドを検証できます。例えば、人の姓、名、ミドルネームを表す 3 つの入力コントロールを検証するために、NameValidator というカスタムのバリデータを作成するとします。

複数のフィールドを調べるバリデータを作成するには、Flex DateValidator クラスと同様に、複数の入力フィールドを指定できるようにバリデータのプロパティを定義するか、バリデータに渡される単一のアイテムに、検証対象のすべてのフィールドを含めます。

次の例では、firstmiddlelast の 3 つのフィールドを含むアイテムを検証する NameValidator を使用します。

<?xml version="1.0" ?>
<!-- validators/MainNameValidator.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:MyComp="myValidators.*"> 

    <mx:Model id="person">
        <name>
          <custName>
             <first>{firstInput.text}</first>
             <middle>{middleInput.text}</middle>
             <last>{lastInput.text}</last>
          </custName>
        </name>
    </mx:Model>

    <mx:TextInput id="firstInput"/>
    <mx:TextInput id="middleInput"/>
    <mx:TextInput id="lastInput"/>

    <MyComp:NameValidator id="nameVal" 
        source="{person}" property="custName" 
        listener="{firstInput}"/>   
    
    <mx:Button label="Validate" click="nameVal.validate();"/>

</mx:Application> 

前の例で実行する SWF ファイルは以下のとおりです。

このバリデータは、3 つの入力フィールドを調べます。firstInput を検証リスナーとして指定します。したがって、検証エラーが発生すると、Flex は最初の TextInput コントロールに検証エラーメッセージを表示します。

次の例に示すように、NameValidator クラスを実装できます。

package myValidators
{
    import mx.validators.Validator;
    import mx.validators.ValidationResult;

    public class NameValidator extends Validator {

        // Define Array for the return value of doValidation().
        private var results:Array;

        public function NameValidator () {
            super();
        }

        override protected function doValidation(value:Object):Array {
        
            var fName:String = value.first;
            var mName:String = value.middle;
            var lName:String = value.last;  
            
            // Clear results Array.
            results = [];

            // Call base class doValidation().
            results = super.doValidation(value);        
            // Return if there are errors.
            if (results.length > 0)
                return results;

            // Check first name field. 
            if (fName == "" || fName == null) {
                results.push(new ValidationResult(true, 
                    "first", "noFirstName", "No First Name."));
                return results;
            }
            
            // Check middle name field.             
            if (mName == "" || mName == null) {
                results.push(new ValidationResult(true, 
                    "middle", "noMiddleName", "No Middle Name."));
                return results;
            }

            // Check last name field. 
            if (lName == "" || lName == null) {
                results.push(new ValidationResult(true, 
                    "last", "noLastName", "No Last Name."));
                return results;
            }
            
            return results;
        }
    }
}

この例では、単一のバリデータを使用して、バリデータに渡された Object の 3 つのサブフィールドを検証するため、ValidationResult クラスのコンストラクタにオプションの 2 番目のパラメータを含めて、検証エラーの原因となったサブフィールドを指定します。これによって、Flex はエラーの原因となった入力コンポーネントを識別し、アプリケーション内でそのコンポーネントをハイライト表示できます。

doValidation() メソッドは、最初の検証エラーを検出すると、直ちに検証エラーを返します。次の例に示すように、すべての入力フィールドを調べてからエラーメッセージを返すように doValidation() を変更できます。このカスタムのバリデータの名前は NameValidatorAllFields.as です。

package myValidators
{
    import mx.validators.Validator;
    import mx.validators.ValidationResult;

    public class NameValidatorAllFields extends Validator {

        // Define Array for the return value of doValidation().
        private var results:Array;

        public function NameValidatorAllFields() {
            super();
        }

        override protected function doValidation(value:Object):Array {
        
            var fName:String = value.first;
            var mName:String = value.middle;
            var lName:String = value.last;  
            
            // Clear results Array.
            results = [];

            // Call base class doValidation().
            results = super.doValidation(value);        
            // Return if there are errors.
            if (results.length > 0)
                return results;

            // Check first name field. 
            if (fName == "" || fName == null) {
                results.push(new ValidationResult(true, 
                    "first", "noFirstName", "No First Name."));
            }
            
            // Check middle name field.             
            if (mName == "" || mName == null) {
                results.push(new ValidationResult(true, 
                    "middle", "noMiddleName", "No Middle Name."));
            }

            // Check last name field. 
            if (lName == "" || lName == null) {
                results.push(new ValidationResult(true, 
                    "last", "noLastName", "No Last Name."));
            }
            
            return results;
        }
    }
}

メソッド内の return ステートメントが 1 行だけになるように、if ステートメントの本体から return ステートメントを削除します。この変更により、1 度に 3 つの異なる検証エラーを検出できます。

 

このページに新しいコメントが追加された場合に、電子メールでの通知を希望する。 | コメントレポート