проверка нескольких полей

Question

У меня есть простая форма с адресом электронной почты и паролем. Я хочу показать кнопку отправки, как только адрес электронной почты и пароль действительны. Мои мысли были, когда я запускаю свою функцию handleValidator, я могу проверить какое-то значение свойства «valid» для email и «valid» свойства pass. Как получить доступ к действительному свойству элемента?

<?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:Script>
    import mx.events.ValidationResultEvent;
    private function handleValidator ( eventObj:ValidationResultEvent ):void {

        if( eventObj.type==ValidationResultEvent.VALID
                          // what goes here?????
                          //  && emailValidator.valid = true ?????
                          //  && passValidator.valid = true  ??????

                          ){ 
            submit.visible = true;
        }
        else {
            submit.visible = false;
        }
    }


</fx:Script>

<fx:Declarations>

    <mx:EmailValidator id="emailValidator" source="{email}" property="text"
                       trigger="{email}" triggerEvent="change"
                       valid="handleValidator(event)" invalid="handleValidator(event)"
                       />
    <mx:StringValidator id="passValidator" source="{pass}" property="text"
                        trigger="{pass}" triggerEvent="change"
                        valid="handleValidator(event)" invalid="handleValidator(event)"
                        minLength="5" maxLength="10"
                        />
</fx:Declarations>
<s:VGroup>

<s:TextInput id="email" />
<s:TextInput id="pass" />
<s:Button id="submit" visible="false" />

</s:VGroup>
</s:Application>

Answer 1

Попробуйте что-нибудь подобное. Сначала поместите ваши валидаторы в массив:

<mx:Array id="validators">
    <mx:EmailValidator id="emailValidator" source="{email}" property="text">

    <mx:StringValidator id="passValidator" source="{pass}" property="text"
        minLength="5" maxLength="10"/>
</mx:Array>

Добавить обработчик события изменения к обоим вашим входам:

<s:TextInput id="email" change="validate()"/>
<s:TextInput id="pass" change="validate()"/>

Обработчик запустит проверку:

private function validate():void{
    //validate both your inputs simultaneously
    var errors:Array = Validator.validateAll(validators);
    if (errors.length>0){
        //hide submit button
    }else{
        //show submit button
    }
}

И это все.

Answer 2

Я бы также пошел с 2DH для проверки, также вы можете посмотреть следующие два поста, на которые я часто ссылаюсь, когда дело доходит до проверки.

http://joelhooks.com/2009/02/01/form-validation-for-the-lazy-programmer-in-flex/

Это объясняет ту же технику, заданную 2DH

http: // aralbalkan.com/1125

этот добавляет немного больше функциональности для лучшего отображения подсказок об ошибках.

Надеюсь, это поможет.

Answer 3

в handleValidator, проверьте идентификатор event.currentTarget, чтобы узнать, был ли проверен адрес электронной почты или пароль. Реагируйте соответствующим образом, а именно, если адрес электронной почты или пароль верны, увеличьте значение переменной, если она недействительна, отправьте пользователю сообщение об ошибке в той или иной форме.

Если оба поля являются действительными, ваша переменная должна быть равна количеству проверяемых полей (при условии, что значение по умолчанию для переменной было 0), затем вы можете показать кнопку отправки.