Flex ComboBox Validator

Foray into Flex – ComboBox Validator

Flex 3.0 does not have a built in validator for combo boxes in flex forms. I found this action script that can validate a combo box or a check box in a flex form.

ComboValidator.as

view plain print about
1// ActionScript file
2//
3// Validates anything against anything, really.
4// Please maintain @author tag.
5// @author Roger Braunstein | Your Majesty Co | 2007
6//
7package com.business.validators
8{
9    import mx.validators.ValidationResult;
10    import mx.validators.Validator;
11
12    public class ComboValidator extends Validator
13    {
14        //You may either accept certain values and reject all others,
15        //or reject certain values and accept all others.
16        //We're too lazy to make sure you don't specify both, but don't.
17        
18        [Inspectable]
19        public var acceptedValues:Array = null;
20        
21        [Inspectable]
22        public var rejectedValues:Array = null;
23        
24        [Inspectable]
25        public var errorMessage:String = "Invalid option selected";
26        
27        public function ComboValidator()
28        {
29            super();
30        }
31        
32        override protected function doValidation(value:Object):Array
33        {
34            var results:Array = super.doValidation(value);
35            
36            var invalid:Boolean = false;
37            if (acceptedValues)
38            {
39                if (acceptedValues.indexOf(value) == -1) invalid = true;
40            } else if (rejectedValues) {
41                if (rejectedValues.indexOf(value) != -1) invalid = true;
42            }
43            
44            if (invalid)
45            {
46                results.push(new ValidationResult(true, "", "", errorMessage));
47            }
48            
49            return results;
50        }
51    }
52}

Note that you will have to change the mapping to exactly where you place this script:

view plain print about
1package com.business.validators
to
view plain print about
1package com.<mydirectory>.<validatorsdirectory>

Your mxml file will look similar to this (hopefully – after all, this is just for reference):

view plain print about
1<?xml version="1.0" encoding="utf-8"?>
2<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
3                xmlns:view="com.view.RequestInfoViews.*"
4                xmlns:ComboValidate="com.business.validators.*"
5                horizontalAlign="center" borderAlpha="0.8"
6                title="Coupon Book Request"
7                xmlns:mate="http://mate.asfusion.com/"
8                showCloseButton="true"
9                close="PopUpManager.removePopUp(this)"
>

Notice that the .as is named "ComboValidate", you may have a better naming convention, I'm just being overly descriptive. xmlns:ComboValidate="com.business.validators.*" It also names the directory location explicitly, "com.business.validators".

Heres the flex combo box for State in my form:

view plain print about
1<mx:GridRow width="100%" backgroundColor="#F4F4F4">
2    <mx:GridItem>
3        <mx:Text text="State:"/>
4    </mx:GridItem>
5    <mx:GridItem horizontalAlign="right">
6        <mx:ComboBox width="160" id="CouponState" dataProvider="{stateData}"/>
7    </mx:GridItem>
8</mx:GridRow>

In my flex form, I'm validating several fields. I just add the following to my Validator array:

view plain print about
1<ComboValidate:ComboValidator id="vCouponState" source="{CouponState}" property="selectedIndex" rejectedValues="{[0]}"/>

ComboValidate – from the TitleWindow reference (if that's what you call it in Flex)
ComboValidator – the name of my ActionScript file in the ComboValidate referenced directory
Id – whatever you want to call it, it doesn't seem to matter, though I'd stay away from reserved words (didn't test that) and keep it similar to your form field
Source – matches the ComboBox Id
Property – which property/attributes of the Flex ComboBox we are checking/validating
rejectedValues – the index in the array we do not want. In this case it's [0] because we want them to select something, the zero index indicates they have not.

Thanks to Roger Braunstein for writing and publishing this ActionScript validation tool. It was very helpful for someone who is just getting into Flex.

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
BlogCFC was created by Raymond Camden. This blog is running version 5.9.7. Contact Blog Owner