Проверка jQuery: изменение правил динамически

Ответ 1

Плагин проверки подлинности Ahh, всегда такой сложный: (

Во-первых, я добавил атрибуты атрибутов во все поля ввода. Затем я сделал для вас функцию изменения:

$("input[name='userAction']").change(function() {
    $('#signupFields').toggle();
    $('#loginFields').toggle();    
    if ($("input[name='userAction']:checked").val() === "login") {
        removeRules(signupRules);
        addRules(loginRules);
    } else {        
        removeRules(loginRules);
        addRules(signupRules);

    }
});

Функции добавления и удаления выглядят следующим образом:

function addRules(rulesObj){
    for (var item in rulesObj){
       $('#'+item).rules('add',rulesObj[item]);  
    } 
}

function removeRules(rulesObj){
    for (var item in rulesObj){
       $('#'+item).rules('remove');  
    } 
}

Это в значительной степени. См. Здесь рабочий пример: http://jsfiddle.net/ryleyb/wHpus/66/

EDIT. Для меня неинтуитивная часть заключается в том, что я не вижу простого способа добавления/удаления правил во всю форму после вызова validate, вместо этого вам нужно манипулировать отдельными элементами формы.

Ответ 2

Или вы можете использовать свойство зависит.

http://jqueryvalidation.org/category/plugin/ поиск зависит от

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

$(".selector").validate({
  rules: {
    contact: {
      required: true,
      email: {
        depends: function(element) {
          return $("#contactform_email:checked")
        }
      }
    }
  }
});

Ответ 3

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

$('#formid').removeData('validator')

Это приведет к удалению подтверждения для формы, а затем снова инициализирует его новыми настройками

Ответ 4

Теперь есть возможность игнорировать базы оснований по критериям выбора, такие как невидимые или отключенные, так что вам не придется менять свой набор правил:

.validate({
  ignore: ":not(:visible),:disabled",
  ...

Ответ 5

попробуйте это.

rules: {
    address: {
       required: {
                   depends: function(element) {
                     if (....){
                       return true;}
                     else{
                       return false;}
                   }
                 }
             }
       }

кредит здесь.

Ответ 6

Это сообщение было опубликовано много лет назад, но, поскольку оно просматривалось много раз, я думаю, было бы полезно сказать, что плагин jQuery Validation теперь позволяет нам читать, добавлять и удалять правила.

Некоторые примеры:

• Распечатайте все правила, прилагаемые к #myField: console.log($('#myField').rules());

• Удалить нежелательное правило: $('#myField').rules('remove', 'min');

• Добавить новое правило: $('myField').rules('add', {min: 10});

Итак, скажите, хотите ли вы динамически обновлять минимальное требуемое значение. Вы можете вызвать remove и a add сразу после:

// Something happened. The minimum value should now be 100
$('#myField').rules('remove', 'min');
$('#myField').rules('add', {min: 100});

Дополнительную информацию можно найти здесь: https://jqueryvalidation.org/category/plugin/#-rules()

Ответ 7

Следите за объектом проверки и удалите/замените правила напрямую. Работает для меня с v1.13.0

var validation = $('#form1').validate(); //Keep track of validation object

//Rule set 1
var validationRulesLogin = {
    headerEmail: {
        required: true,
        email: true
    },
    headerPassword: "required"
};
var validationMessagesLogin = {
    headerEmail: {
        required: "Please enter your email address.",
        email: "Not a valid email address."
    },
    headerPassword: "Please enter your password."
};

//Rule set 2
var validationRulesSignup = {
    signupEmail: {
        required: true,
        email: true
    },
    signupPassword: "required",
    signupPassword2: {
        equalTo: "#phBody_txtNewPassword"
    }
};
var validationMessagesSignup = {
    signupEmail: {
        required: "Please enter your email address.",
        email: "Not a valid email address."
    },
    signupPassword: "Please enter your password.",
    signupPassword2: "Passwords are not the same."
};

//Toggle rule sets
function validatingLoginForm(){
    validation.resetForm();
    validation.settings.rules = validationRulesLogin;
    validation.settings.messages = validationMessagesLogin;
}
function validationSignupForm(){
    validation.resetForm();
    validation.settings.rules = validationRulesSignup;
    validation.settings.messages = validationMessagesSignup;
}

Ответ 8

Взгляните на мой ответ fooobar.com/questions/132040/.... Он включает рабочий jsfiddle. В вашем примере будет что-то вроде этого:

$("input[name='userAction']").change(function() {

    var settings = $("#myForm").validate().settings;

      if ($("input[name='userAction']:checked" ).val() === "login") {
            $.extend(settings, {
              rules: loginRules
            });
    } else {
            $.extend(settings, {
              rules: signupRules
            });
    }


    $("#myForm").valid();

});

Ответ 9

У меня была аналогичная проблема, и я решил ее, добавив класс "requiredForLogin" ко всем текстовым полям входа и классу "requiredForSignUp" ко всем текстовым полям регистрации.

Затем используется jQuery toggleClass и jQuery.validate addClassRules для включения и выключения правил в зависимости от того, какая кнопка была нажата.

function EnableAllValidation() {
    // remove the jquery validate error class from anything currently in error
    //  feels hackish, might be a better way to do this
    $(".error").not("label").removeClass("error");

    // remove any the 'disabled' validation classes, 
    //  and turn on all required validation classes 
    //  (so we can subsequently remove the ones not needed)
    $(".requiredForLoginDisabled").toggleClass("requiredForLoginDisabled requiredForLogin");
    $(".requiredForSignUpDisabled").toggleClass("requiredForSignUpDisabled requiredForSignUp");
}
function EnableLoginValidation() {
    // reenable all validations
    //  then disable the signUp validations
    EnableAllValidation();
    $(".requiredForSignUp").toggleClass("requiredForSignUpDisabled requiredForSignUp");
}
function EnableSignUpValidation() {
    // reenable all validations
    //  then disable the login validations
    EnableAllValidation();
    $(".requiredForLogin").toggleClass("requiredForLoginDisabled requiredForLogin");
}
$(document).ready(function () {
    $("input[value='login']").click(function () {
        EnableLoginValidation();
    });
    $("input[value='signup']").click(function () {
        EnableSignUpValidation();
    });

    $("#myForm").validate();
    jQuery.validator.addClassRules({
        requiredForSignUp: {
            required: true
        },
        requiredForLogin: {
            required: true
        }
    });

});

Ответ 10

приведенный ниже код работает превосходно...

.validate({
  ignore: ":not(:visible),:disabled",
  ...