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

Flex Validator: Personnaliser les tooltip d'erreur du CurrencyValidator

Le composant Flex CurrencyValidator permet de vérifier la validité d'un montant, en dollar ou en euros par exemple

Lorsque la validation ne se fait pas, un tooltip s'affiche avec des valeurs par défaut:

• Plusieurs séparateurs de décimales: "The decimal separator can only occur once"
• Valeur supérieure à la valeur maximale: "The number entered is too large"
• Le nombre n'est pas un entier: "The number must be an integer"
• Le nombre contient des lettres ou autres caractères: "The input contains invalid characters"
• Le nombre contient plusieurs séparateurs ou signe moins: "One of the formatting parameters is invalid"
• Valeur inférieue à la valeur minimale: "The number entered is too small"
• Le nombre entré est négatif (restriction): "The number may not be negative"
• Le nombre contient trop de chiffres après la virgule: "The number entered has too many digits beyond the decimal point"
• Le séparateur des milliers est mal placé: "The thousands separator must be followed by three digits"
• La devise n'est pas placée au bon endroit: "The currency symbol occurs in an invalid location"

Pour pouvoir personnaliser ces messages, pour les écrire en français pas exemple, l'objet CurrencyValidator possède plusieurs propriétés:

• decimalPointCountError: Plusieurs séparateurs de décimales
• exceedsMaxError: Valeur supérieure à la valeur maximale
• integerError: Le nombre n'est pas un entier
• invalidCharError: Le nombre contient des lettres ou autres caractères
• invalidFormatCharsError: Le nombre contient plusieurs séparateurs ou signe moins
• lowerThanMinError: Valeur inférieue à la valeur minimale
• negativeError: Le nombre entré est négatif (restriction)
• precisionError: Le nombre contient trop de chiffres après la virgule
• separationError: Le séparateur des milliers est mal placé
• currencySymbolError: La devise n'est pas placée au bon endroit (à gauche par défaut)

Flex Validator: Exemple de CurrencyValidator en MXML et ActionScript

L’exemple suivant montre comment utiliser ce composant Flex CurrencyValidator avec des messages d'erreur personnalisés:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" viewSourceURL="srcview/index.html">

    <mx:Script>
        import mx.controls.Alert;
    </mx:Script>

    <mx:CurrencyValidator source="{priceUS}" property="text" precision="2"
        trigger="{myButton}" triggerEvent="click" 

        currencySymbolError="Le symbole de la devise courante n'est pas au bon endroit"
        decimalPointCountError="Le séparateur de décimales ne peut apparaître qu'une seule fois"
        exceedsMaxError="La valeur entrée est trop grande"
        invalidCharError="Ce champ contient des caractères invalides"
        invalidFormatCharsError="Un des paramètres de séparation est invalide"
        lowerThanMinError="La valeur entrée est trop faible"
        negativeError="La valeur entrée ne peut pas être négative"
        precisionError="La valeur entrée contient trop de chiffres après la décimale"
        separationError="Les milliers doivent être suivis de 3 chiffres"

        valid="Alert.show('Le champ est valide');"/>

    <mx:Panel title="Exemple simple de CurrencyValidator" width="75%" height="75%"
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

        <mx:Form>
            <mx:FormItem label="Entrez un montant en dollars ($1,877.56 par ex): ">
                <mx:TextInput id="priceUS" width="100%"/>
            </mx:FormItem>

            <mx:FormItem >
                <mx:Button id="myButton" label="Valider" />
            </mx:FormItem>
        </mx:Form>
    </mx:Panel>
</mx:Application>

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