проверка jQuery по нескольким полям

У меня есть 3 поля ввода, которые просят за количество людей, и из них сколько взрослых и сколько детей. Я пытаюсь использовать плагин jQuery validate для добавления пользовательского метода, где дети + взрослые = количество людей

Это мой вызов проверки

$("#form2").validate({
    errorElement: "span",
        rules: {
        attendees: {
             required: true,
             digits: true
        },              
        adults: {
             required: true,
             digits: true
        },              
        children: {
             required: true,
             digits: true
        }
    },
    messages: {
        attendees: "Enter the number of persons (including yourself)", 
        adults: "Enter number of adults", 
        children: "Enter number of childern"                
    }               
});

Я посмотрел на функцию группы и addMetod плагина validate, но кажется, что он был создан только с одним элементом. Есть идеи ?

10
jquery jquery-validate

3 ответов

соблюдать документация для создания пользовательского метода/правила. Здесь я просто называю это totalCheck, но вы можете назвать его как угодно.

$.validator.addMethod('totalCheck', function(value, element, params) {
    var field_1 = $('input[name="' + params[0] + '"]').val(),
        field_2 = $('input[name="' + params[1] + '"]').val();
    return parseInt(value) === parseInt(field_1) + parseInt(field_2);
}, "Enter the number of persons (including yourself)");

он реализован так же, как и любое другое правило. Эти два параметра являются name атрибуты двух других полей, которые вы хотите проверить против. Так как это новое правило говорит, что поле должно содержать сумму двух других полей,required и digits правила теперь избыточны и могут быть удаленный.

$("#form2").validate({
    errorElement: "span",
    rules: {
        attendees: {
            totalCheck: ['adults', 'children'] // <-- your custom rule
        },
        adults: {
            required: true,
            digits: true
        },
        children: {
            required: true,
            digits: true
        }
    },
    messages: {
        adults: "Enter number of adults",
        children: "Enter number of childern"
    }
});

рабочая демо: http://jsfiddle.net/hBXL6/

24

ответ спарки не является полным:adults и children необходимо повторно проверить attendees при изменении.

добавьте это в конце:

$('input[name=adults],input[name=children]').on('change', function(){
  $('input[name=attendees]').removeData("previousValue").valid();
});

Примечание: хотя я держу PhD в CS, у меня пока нет комментариев... отсюда и новый ответ.

1

как подсказали в комментариях, это не очень хорошая практика. Тем не менее, если вы все еще хотите это сделать:

$("#form2").validate({
    errorElement: "span",
        rules: {
        attendees: {
             equal: $("#form2 #adults").val() + $("#form2 #children").val();
        },              
        adults: {
             required: true,
             digits: true
        },              
        children: {
             required: true,
             digits: true
        }
    },
    messages: {
        attendees: "Enter the number of persons (including yourself)", 
        adults: "Enter number of adults", 
        children: "Enter number of childern"                
    }               
});
-1