jQuery проверить, подтвердить выбор: видимый - PullRequest
Новая
       36

jQuery проверить, подтвердить выбор: видимый

0 голосов
/ 05 июля 2011

Я работаю над проектом с jQuery Validate (http://bassistance.de/jquery-plugins/jquery-plugin-validation/),, где отображаются некоторые selects, если вы щелкнете по некоторому checkboxes.

Группа флажков обязательна, но я хочу сделать только видимое SELECT обязательным.

Я пытался addClass("required"), когда показывал SELECT, но это не сработало.

Я обыскал всю сеть или то, что он чувствует, но не могу найти никакого решения.

Можно ли проверить только видимое SELECTs или как мне это сделать?

Заранее спасибо.

* ОБНОВЛЕНИЕ * Пожалуйста, посмотрите мой пример: http://jsfiddle.net/mtLZG/17/

Ответы [ 3 ]

1 голос
/ 06 июля 2011

с этим кодом у вас все в порядке: 

$(document).ready(function() { //Shows the sub-options, if checkboxes are selected per default $('input:checked').parent().addClass("visible");

$(':checkbox').live("change", function(){
    //Show the suboption
    $(this).parent().toggleClass("visible");
    //Add required-class to the Select
    $(this).parent().children("select").toggleClass("required");  
    //I tried to validate the form again, after the above class was added
    $('form').validate();      
});

//Validate
$('form').validate();
});

Я немного изменил вашу разметку, чтобы она работала немного лучше.Посмотрите на скрипку, если она работает как положено.

http://jsfiddle.net/mtLZG/18/

0 голосов
/ 02 февраля 2013

Я понимаю, что это более старый вопрос, но я считаю, что этот ответ стоит читателю, поскольку jQuery Validate ( начиная с версии плагина 1.9.0 ) теперь игнорирует скрытые поля по умолчанию .

В основном это jQuery, в котором удалены все ненужные строки, а .live() обновлен до более современного jQuery .on(). 

$(document).ready(function () {

    $('input:checked').parent().addClass("visible");

    $(':checkbox').on("change", function () {
        $(this).parent().toggleClass("visible");
    });

    // Initialize Validate plugin; .validate() called ONCE
    $('form').validate({
        ignore: ":hidden"  // only use this option for plugin version below 1.9.0
    });

});

Чтобы это работало, к вашему HTML должны быть применены следующие изменения:

1) select элемент нуждается в атрибуте name, иначе плагин Validate его игнорирует.

2) select элементу необходимо class='required' для назначения правила. (Это теперь автоматически игнорируется всякий раз, когда элемент скрыт.)

3) Сначала option требуется атрибут value="", чтобы сообщить плагину, что первый элемент недопустим. 

<select class="required" name="suboption1">
    <option selected="selected" value="">Select an option</option>
    <option>Sub-Option 1</option>
    ...
</select>

Рабочая демоверсия: http://jsfiddle.net/ZLXuU/

Общие примечания:

1) Использование .validate() до инициализация плагин ONCE в DOM ready.

2) Больше никогда не нужно вызывать .validate(), поскольку он только повторно инициализирует плагин. Используйте .valid() до test валидности формы и вызывайте любые сообщения об ошибках.

3) ignore: ":hidden" теперь является опцией по умолчанию для версии Validate 1.9.0 +

0 голосов
/ 04 октября 2011

Установка кода проверки как 

$('form').validate({
   ignore: ":hidden"
});

Он должен обрабатывать вещи просто отлично, даже если игнорировать скрытые выборки.Конечно, есть и другие потенциальные проблемы с проверкой выбора.

...