3 Replies Latest reply on Jun 26, 2010 6:47 PM by hezjing

    NumberValidator only display error the 1st time?

    hezjing Level 1

      Hi

       

      I want to validate the user input (number), so here is my code:

       

      <?xml version="1.0" encoding="utf-8"?>

      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

         xmlns:s="library://ns.adobe.com/flex/spark"

         xmlns:mx="library://ns.adobe.com/flex/mx">

        <fx:Declarations>

          <mx:NumberValidator source="{numberInput}"

                              property="text"

                              allowNegative="false"

                              domain="int"

                              trigger="{numberInput}"

                              triggerEvent="change" />

        </fx:Declarations>

        <s:TextInput id="numberInput" />

      </s:Application>

      Then run and perform the steps below:
      • The numberInput is displayed with normal border.
      • Enter a character "a" -> numberInput now has red border and an error "The input contains invalid characters." is displayed.
      • Delete the character "a" -> numberInput now empty, but border still in red.
      • Enter "1", followed by a "a" -> numberInput now has red border but there is no error message.

       

      Why the error "the input contains invalid characters" is not displaying any more when user enter the invalid character again?

       

       

        • 1. Re: NumberValidator only display error the 1st time?
          VRPDeveloper Level 3

          It is not what you are thinking."the error "the input contains invalid characters" is not displaying any more when user enter the invalid character again"

           

          It will display only thing is either you have to use tab button from that textinput control to see the error message. So ultimately is the trick is in triggerevents. It depends on which event you are using.

           

          Other option is use eventhandler where you can call validator.validateall() method so all validators will show error at a sametime....

          • 2. Re: NumberValidator only display error the 1st time?
            rtalton Level 4

            I agree with VRPDeveloper's comments.

             

            There are a couple of things you can do to get rid of the error border.

            Add this to your NumberValidator:

            valid="{numberInput.errorString=

            ''}"

            That will remove the red border when you type a number back in.

             

            You can also set the restrict property of the TextInput so the user can never type in anything but a number:

            restrict="

            [0-9]"

            Then you won't have any error border at all. Unless you add required="true" to the validator, enter the field, then exit the field. An error border will then appear.

            • 3. Re: NumberValidator only display error the 1st time?
              hezjing Level 1

              For my case, I want to validate the input as the user entered every single character. Hence the NumberValidator is listening to the change event of the TextInput control (real-time validation).

               

              In my previous example, the validator is displaying an error when the user typed a character "a" without pressing any tab or enter key. But not anymore when the user typed "1a" ...