Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

Flex Validator: Exemple de StringValidator en MXML et ActionScript

Le composant StringValidator vous permet de vérifier que la longueur d'une chaîne de caractère est comprise dans un certain intervalle.

Vous avez accès à 2 propriétés:

• minLength: longueur minimale de la chaîne (int)
• maxLength: longueur maximale de la chaîne (int)

Flex Validator: Personnaliser les tooltip d’erreur du StringValidator

L'exemple suivant montre comment utiliser ce composant Flex StringValidator en MXML. Il impose un nombre de caractère entre 6 et 12 pour le deuxième champ texte:

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

    <mx:Form id="membershipForm">
        <mx:FormItem id="fullNameItem" label="Nom">
        <!-- Not validated -->
            <mx:TextInput id="fullNameInput"/>
        </mx:FormItem>
        <mx:FormItem id="userNameItem" label="Nom d'utilisateur">
            <mx:TextInput id="userNameInput"/>
        </mx:FormItem>
    </mx:Form>

    <mx:Button label="Valider"/>

    <mx:StringValidator source="{userNameInput}" property="text"
        minLength="6" maxLength="12"/>
</mx:Application>

Flex Source Code Download: Télécharger le code source complet de l'application

Pour créer ce composant avec le même comportement en ActionScript, il suffit d'utiliser ce code AS3:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
    creationComplete="initApp()">
    <mx:Script>
        <![CDATA[
            import mx.validators.StringValidator;
            public function initApp():void{
                var strValidator:StringValidator = new StringValidator();
                strValidator.source = userNameInput;
                strValidator.property = "text";
                strValidator.minLength = 6;
                strValidator.maxLength = 12;
            }
        ]]>
    </mx:Script>
    <mx:Form id="membershipForm">
        <mx:FormItem id="fullNameItem" label="Nom">
        <!-- Not validated -->
            <mx:TextInput id="fullNameInput"/>
        </mx:FormItem>
        <mx:FormItem id="userNameItem" label="Nom d'utilisateur">
            <mx:TextInput id="userNameInput"/>
        </mx:FormItem>
    </mx:Form>

    <mx:Button label="Valider"/>

</mx:Application>