在 Flex 中的多个控件上使用相同的验证器答案

【问题标题】：use the same validator on several controls in Flex在 Flex 中的多个控件上使用相同的验证器
【发布时间】：2011-10-08 20:31:58
【问题描述】：

假设我在 flex 中有一个电话号码验证器，并且我有两个用于电话号码的 TextInput 控件。我不想定义两个具有基本相同属性的单独验证器控件......但每个验证器只有一个“源”属性。如何在多个控件上使用相同的验证器？（或任何等效的解决方案）

【问题讨论】：

标签： apache-flex flex3

【解决方案1】：

不是内联的，但您可以通过编程方式执行验证，例如，在提交表单时，或者当用户跳出控件时等等。这是一个使用单个 PhoneNumberValidator 来验证两个表单字段的示例；点击提交按钮时进行验证：

<mx:Script>
    <![CDATA[

        private function validatePhoneNumber(txt:TextInput):void
        {
            v.listener = txt;
            v.validate(txt.text);
        }

        private function btn_click():void
        {
            validatePhoneNumber(p1);
            validatePhoneNumber(p2);
        }

    ]]>
</mx:Script>

<mx:PhoneNumberValidator id="v" allowedFormatChars="()- .+" property="text" requiredFieldError="Required." wrongLengthError="Invalid length." invalidCharError="Invalid character." />

<mx:Form>
    <mx:FormItem label="Phone Number 1">
        <mx:TextInput id="p1" />    
    </mx:FormItem>
    <mx:FormItem label="Phone Number 2">
        <mx:TextInput id="p2" />    
    </mx:FormItem>
    <mx:FormItem>
        <mx:Button id="btn" label="Submit" click="btn_click()" />
    </mx:FormItem>
</mx:Form>

希望对您有所帮助！

【讨论】：

【解决方案2】：

重现步骤：

TextInput 动态创建

textInputBox = new MyTextInput;
textInputBox.restrict = “0-9.”;
textInputBox.maxChars = 24;
amountValidator = new NumberValidator();
amountValidator.source = textInputBox;
amountValidator.property = “text”;
amountValidator.allowNegative = false;
amountValidator.domain = “real”;
amountValidator.precision = 4;
amountValidator.required = false;
amountValidator.maxValue = 999999999999.9999;
amountValidator.trigger = textInputBox;
amountValidator.triggerEvent = Event.CHANGE;
amountValidator.addEventListener(ValidationResultEvent.VALID, amountValid);
amountValidator.addEventListener(ValidationResultEvent.INVALID, amountInvalid);

private function amountValid(event:ValidationResultEvent):void
{
    valid = true;
    fieldsValidated = true;
}

private function amountInvalid(event:ValidationResultEvent):void
{
    valid = false;
    fieldsValidated = true;
}

正如创建中提到的，当我们超过限制时，它会显示错误我的红色边框，同时如果您在达到给定可接受的限制时按DEL键删除它们，很快就会自动变为绿色。
离开该字段并更改另一个文本输入的值（这只是一个文本输入，这是一个表单，还有一些表单元素），然后通过 SHIFT+TABS 回到超出文本字段的值并删除额外输入的数字，当您很快变绿时，您的价值就会被接受。
现在再次输入更多值，现在您处于警告区域，然后离开该字段并在其他表单元素中进行少量更改。
然后返回到鼠标单击提交的值超出文本，并从 DEL 开始删除，即使您删除了其他值，仍然字段显示您处于警告区域。

实际结果： 即使删除额外的数字，仍然是红色的字段

预期结果： 如果删除额外的数字，字段应该会恢复正常状态。

这个问题的图片可以在View Screen Shot查看

【讨论】：