Плагин jQuery Validation, включите флажок, когда поле действительно

0

Я использую jQuery, jQuery Mobile и плагин jQuery Validation

У меня есть поле "password" и флажок "Rememberpassword".

Я бы хотел, чтобы флажок был включен только после проверки пароля.

Вот два поля в HTML

<input type="password" name="password" class="submit required" minlength="6" />
<input type="checkbox" name="rememberpassword" value="remember" />

Чтобы включить или отключить этот флажок, я использую команды jQuery Mobile

$('[name=rememberpassword]').checkboxradio( "enable" ); and
$('[name=rememberpassword]').checkboxradio( "disble" );

Я не могу понять, где я могу добавить эти команды в правила проверки.

Я попытался добавить команды enable/disable в правиле проверки для поля пароля следующим образом:

$(form).validate({
      rules: {
        password: {
          required: {
            depends: function(element) {
              console.log('In the password depends');
              if (!$(element).hasClass('error')) {
                $('[name=rememberpassword]').checkboxradio("enable");
              } else {
                $('[name=rememberpassword]').checkboxradio("disable");
              }
              return true;
            }
          }
        }
      }
    });

Проблема с этим подходом, действительные классы и классы ошибок добавляются к элементам для проверки только после первого ввода данных в поле пароля, поэтому флажок остается действительным.

Я также попытался проверить форму или поле пароля с помощью .valid() но это, похоже, ничего не делает, если поле не было заполнено чем-то.

Я попытался сделать то же самое, но используя метод .valid() для пароля вместо тестирования на наличие класса ошибки, но этот результат будет справедливо в рекурсии до тех пор, пока не будет возвращена ошибка.

Я не нашел способ проверить правильность поля, которое не вызвало бы полной проверки и последующей рекурсии.

Любая помощь будет оценена по достоинству.

  • 0
    Пожалуйста, покажите все попытки. Мне очень интересно посмотреть, как вы попробовали это при использовании .valid() .
  • 0
    Привет, Спарки, извините, я сделал так много попыток с использованием всех видов искаженной логики, что я действительно не помню, что я пытался сделать с помощью функции .valid (), извините ...
Теги:
jquery-mobile
jquery-validate

1 ответ

2

Условные правила/функции предназначены только для:

  • когда правило зависит от чего-то другого. (Пример: поле только "требуется", когда галочка отмечена.)

Он не предназначен для:

  • выполнение функции всякий раз, когда правило выполняется в поле.

(Да, как вы видели, если вы используете параметр .valid() как часть условия правила, вы .valid() рекурсию.)

Решение состоит в том, чтобы использовать keyup функцию обработчика событий наряду с в .valid() метод, чтобы проверить состояние поля.

$(document).on('pageinit', function () { // <- DOM ready handler for jQuery Mobile

    // initialize plugin with .validate()
    $('#myform').validate({ 
        // your rules & options
    });

    // fire this function on every key-up event within the password field
    $('input[name="password"]').on('keyup', function () { 
        if ($(this).valid()) {             // <- check if password field is valid
            $('[name="rememberpassword"]')
                .checkboxradio('enable');  // <- enable checkbox
        } else {
            $('[name="rememberpassword"]')
                .checkboxradio('disable')  // <- disable checkbox
                .attr('checked',false)     // <- uncheck checkbox if checked
                .checkboxradio('refresh'); // <- refresh checkbox
        }
    });

});

Рабочая DEMO: http://jsfiddle.net/6eEBC/

Я решил не делать эту часть onkeyup обратного вызова onkeyup плагина, поскольку это применимо к каждому событию keyup каждого поля в форме.

Я также "сниму" флажок, потому что, я полагаю, вы не хотите, чтобы он застрял на "проверке", если он снова отключается.

Согласно документам jQuery Mobile, вам нужно использовать .checkboxradio('refresh') когда вы "манипулируете флажком через JavaScript", чтобы обновить визуальный стиль. В соответствии с примерами на этой странице это применимо только при проверке/снятии флажка программно.

Поделиться
  • 0
    Привет, Спарки, спасибо, я пытался оставаться строго в пределах плагина Validation, пока ваше решение работает, оно нарушает правила, установленные плагином валидации, при начальном вводе данных плагин выполняет ленивую валидацию, отображая только сообщение как только пользователь покидает поле, как только отображается сообщение, плагин превращается в строгую проверку и отображает нажатие клавиш нажатием клавиш сообщений об ошибках. В то время как ваша функция решения может вызвать раздражение, сразу появляется сообщение об ошибке. Единственное решение, которое я могу придумать, - повторить правила валидации в разделе keyup . Благодарю.
  • 0
    О .checkboxradio('refresh') Я обнаружил, что мне не нужно использовать его при простом включении / отключении флажка. Обновление необходимо при выполнении более тяжелых манипуляций, таких как, например, динамическое добавление флажка.
Показать ещё 10 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню