Добавление правил проверки jQuery на основе атрибутов данных в цикле

Question

Я использую плагин jQuery validation , пытающийся добавить правила на основе атрибутов data-. Я добавляю правила min / maxlength на основе data-minlength или data-maxlength. Вот пример HTML:

<form>
    <input name="input1" data-maxlength="5" data-minlength="3" required>
    <input name="input2" data-maxlength="5" required>
    <input name="input3" data-minlength="3" required>
    <button>Submit</button>
</form>

Я делаю это, чтобы добавить правила, и все работает нормально:

$('input[data-minlength]').each(function(){
    if ($(this).data('minlength')) {
        $(this).rules("add", {
            minlength: $(this).data('minlength')
        });
    }
});

$('input[data-maxlength]').each(function(){
    if ($(this).data('maxlength')) {
        $(this).rules("add", {
            maxlength: $(this).data('maxlength')
        });
    }
});

Но я хотел сократить его, поэтому я попробовал это, и оно не работает:

['minlength', 'maxlength'].forEach(function(item){
    $('input[data-'+item+']').each(function(){
        if ($(this).data(item)) {
            // alert(item) shows the correct rule name
            $(this).rules("add", {
                // Next line fails, but hardcoding a rule name works
                item: $(this).data(item)
            });
        }
    });
});

Ошибка в том, что $.validator.methods[method] не определено. Каким-то образом ему передается неправильное имя метода, хотя alert(item) говорит мне, что имя правила правильное.

Кто-нибудь знает, почему или у меня есть альтернативное решение, которое я могу использовать для сокращения повторяющегося рабочего кода выше?

Демо: http://jsfiddle.net/kaVKe/1/

Answer 1

Это не работает, потому что вы создаете литерал объекта с новым свойством item.

как насчет этого?

['minlength', 'maxlength'].forEach(function(item){
    $('input[data-'+item+']').each(function(){
        if ($(this).data(item)) {
            // alert(item) shows the correct rule name
            var options = {};
            options[item] = $(this).data(item);

            $(this).rules("add", options);
        }
    });
});

Это создает объект параметров и добавляет необходимое свойство.

Answer 2

Попробуйте:

['minlength', 'maxlength'].forEach(function(item){
    $('input[data-'+item+']').each(function(){
        if ($(this).data(item)) {
            var rule = {};
            rule[item] = $(this).data(item);
            $(this).rules("add", rule);
        }
    });
});

Ваше решение не работает, потому что в литеральной записи объекта имена свойств не будут интерпретироваться как переменные:

{
  item: ... // <-- this one
}

Answer 3

Почему бы вам просто не сделать

$('input').each(function(){
    var max = $(this).data('maxlength');
    var min = $(this).data('minlength')
    if (min) {
        $(this).rules("add", {
            minlength: min 
        });
    }
    if (max) {
        $(this).rules("add", {
            maxlength: max 
        });
    }
});

скрипка здесь http://jsfiddle.net/kaVKe/2/ Ваш код не работает, я думаю, потому что вы не можете использовать переменную для имени свойства

// Next line fails, item is always interpreted as item, not as maxlength/minlength
item: $(this).data(item)