Required fields in flex - apache-flex

Question

I've got a question about flex.
I have a form and the email is required.
I googled this and found the following solution:
<mx:FormItem label="Email" id="emailFormItem" width="100%" styleName="formEven" required="true">
<mx:TextInput id="emailTextInput" width="100%" text="{user.email}"/></mx:FormItem>
The problem is that when I press ok the call is still made.
I know you have to validate the following by yourself but does anyone has an idea how I can validate the field(s)?
Solution:
I've found a solution for this:
You can create a validator for each field you want to validate and then create this function:
private function isValid():Boolean {
var failedValidators:Array = Validator.validateAll([emailValidator, userNameValidator, languageValidator, firstNameValidator, lastNameValidator]);
return failedValidators.length == 0;
}
This can be closed.

Answer 1

what I generally do is create a method called something like isSubmitEnabled or isFormComplete. I call it on keyUp on every field that is required and check for values in all of the fields (and any other validation I want to do) and then as long as everything checks out I set the submit button to be enabled otherwise I set the submit button to be disabled. As long as you disable the button when you start then you should be good to go.
I have used this method several times and find it to be the easiest to use and especially to maintain. I will look at the docs and see if I can see what you can do with the required attribute on the form item though.
Update:
According to the docs:
This property controls the indicator
display only. You must attach a
validator to the children if you
require input validation.
What you want is mx.validators.Validator (http://livedocs.adobe.com/flex/3/langref/mx/validators/Validator.html)
<mx:Validator id="reqValid" required="true"
source="{fname}" property="text"
valid="handleValid(event)" invalid="handleValid(event)"/>
See the code examples on that link to see how to use it. The example is actually exactly what you are looking for I think. HTH

Answer 2

<fx:Declarations>
<mx:RadioButtonGroup id="a1" itemClick="usdradio(event);"/>
<fx:Model id="creditcard">
<card>
<cardType>{cardTypeCombo.selectedItem.data}</cardType>
<cardNumber>{cardNumberInput.text}</cardNumber>
</card>
</fx:Model>
<mx:CreditCardValidator id="ccV"
cardTypeSource="{creditcard}" cardTypeProperty="cardType"
cardNumberSource="{creditcard}" cardNumberProperty="cardNumber"
trigger="{myButton}" triggerEvent="click"
cardTypeListener="{cardTypeCombo}"
cardNumberListener="{cardNumberInput}"
valid="Alert.show('Validation Succeeded!')"/>
<mx:ArrayCollection id="dp">
<fx:Object label="American Express" data="American Express"/>
<fx:Object label="Diners Club" data="Diners Club"/>
<fx:Object label="Discover" data="Discover"/>
<fx:Object label="MasterCard" data="MasterCard"/>
<fx:Object label="Visa" data="Visa"/>
</mx:ArrayCollection>
<mx:CurrencyValidator source="{priceUS}" property="text" precision="2"
trigger="{myButton2}" triggerEvent="click"
valid="Alert.show('Validation Succeeded!')"/>