Text Input error / validation and restore previous correct value in Flex

Question

I have text input boxes. There is validation for each of the boxes using numberValidator. Now, the thing is that am using alert box to show if any error occurs.

Flowchart ::

1> Insert value in textBox. 2> NumberValidator validates the input on "trigger=change". 3> If error, alert message is displayed. The user clicks OK to go back to form. 4> Focus set back to the TextBox. 5> But, alert box makes the text input value blank / null. i.e. Both the previous error value entered by user and the default correct value will not be displayed now.

Goal : Display the most recent correct value that was entered in the text box. Not the default of any other, but the most recent correct value entered by the user.

can anyone help ??

Answer 1

You will need to store the most recent correct answer in a variable and have the click/close handler of the alert replace the value with the stored var.

here is an example of listening for alert event:

<?xml version="1.0"?>
<!-- controls\alert\AlertEvent.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"&gt;

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.events.CloseEvent;

      private var lastKnownCorrectAnswer:String = "Some Answer";

            private function alertListener(eventObj:CloseEvent):void {
                // Check to see if the OK button was pressed.
                if (eventObj.detail==Alert.OK) {
                    myText.text = lastKnownCorrectAnswer; 
                }
            }
        ]]>
    </mx:Script>

    <mx:TextInput id="myAnswer" 
        width="150" 
        text="" />
    <mx:Button id="myButton" 
        label="Copy Text" 
        click='Alert.show("Copy Text?", "Alert",
            Alert.OK | Alert.CANCEL, this,
            alertListener, null, Alert.OK);'/>
</mx:Application>

You will need to add your validation logic in there, but you get the idea. The above is from the Alert docs.

Answer 2

Here is a complete answer. I used the "enter" event of the text box to do validation since the "change" event fires after only a single character is entered

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
       layout="absolute">
    <mx:Script>
     <![CDATA[
      import mx.controls.Alert

      // set last correct value to a default
      private var lastCorrectValue:String="411"

      function handleInvalid(event:Event)
      {
       Alert.show("invalid");
       textInput.text=lastCorrectValue
      }

      function handleValid()
      {
       Alert.show('Validation Succeeded!')
       lastCorrectValue=textInput.text
      }
     ]]>
    </mx:Script>
    <mx:TextInput id="textInput"
         text="{lastCorrectValue}"/>
    <!-- Use the enter event of the text box to do validation. The change event fires after a single character-->
    <mx:NumberValidator source="{textInput}"
         property="text"
         integerError="Enter Integer value"
         domain="int"
         trigger="{textInput}"
         triggerEvent="enter"
         invalid="handleInvalid(event)"
         valid="handleValid();"/>
</mx:Application>