Условно установлен атрибут полей ввода, если требуется, если флажок установлен с помощью jQuery

Question

Я использую плагин проверки правильности jquery Tools, и у меня есть форма с несколькими разделами. В каждом разделе есть флажок вверху, который я хочу быть главным переключателем для каждого раздела - для программной функции включения/выключения (например, проверки) для текстовых полей & полей электронной почты в каждом разделе.

В принципе, я хотел бы условно установить атрибут полей ввода «текст» и/или «адрес электронной почты» на «требуется», если выбрана соответствующая группа. По общему признанию, я не так хорош с jQuery.

Каждая форма раздела аналогична ниже, но может иметь различное количество текста и/или электронной почты полей:

<input type="checkbox" group-name="mail" name="mail" id="mail_enable" 
     checked="<?= (chkConfig("mail_enable", 0) ? "yes" : "no"); ?>" 
     onChange="chkRequired('mail');" 
     title='check this box to send the specified reports to your email.' > 
     <label for="mail_enable">notify me when the batch is complete.</label></div> 
    <div class="left"><label for="lblemailid">Email Address: </label></div> 
    <div class="right"><input type="email" group-name="mail" name="mailto" 
     id="emailAddress" size="30" maxlength="50" /> 

Я создал атрибут называется имя-группы и все поля в доле в Секцию то же имя группы. и с помощью г-на Фредерика Хамиди (в нашем обсуждении ниже) мы изменили мою функцию. вот последняя версия:

function chkRequired(group){ 
    var groupCheckBox = $("#" + group + "_enable"); 
    var groupSelector = "[group-name='" + groupCheckBox.attr("group-name") + "']"; 
    var fieldSelector = "input[type=text], input[type=email]"; 
    if ($(groupCheckBox).is(':checked')) { 
     $(groupSelector).add(fieldSelector).attr("required"); 
     } else { 
     $(groupSelector).add(fieldSelector).removeAttr("required"); 
    } 
    } 

Надеюсь, это поможет кому-то еще в подобной ситуации.

Я все еще не могу определить синтаксис селектора, чтобы прикрепить его к doc.ready() amd .change() по всему миру. но он работает, если вы назначите функцию событию onChange для полей вручную.

Кроме того, если кто-нибудь может помочь мне с синтаксисом validator.addMethod(), поэтому мы можем просто создать собственный метод проверки, который будет оценен.

Особая благодарность г-ну Фредерику Хамиди за помощь в разработке логики.

Я создал более подробный учебник, если кто-то заинтересован @http://www.logicwizards.net/2010/12/07/jquery-tools-custom-validator-mod/

Джо Негрон: Логические Wizards ~ NYC

Answer 1

Ну, $('#'+groupName).val() возвращает undefined, потому что ваш флажок соответствует #mail_enable, не #mail. Вам даже не нужно его вычислять во второй раз, так как вы использовали его раньше, чтобы получить имя группы.

Кроме того, val() возвращает значение этого флажка, но не его состояние. Вам нужен атрибут checked (или селектор :checked) для этого:

function chkRequired(group) 
{ 
    var groupCheckBox = $("#" + group + "_enable"); 
    var groupSelector = "[group-name='" + groupCheckBox.attr("group-name") + "']"; 
    if (groupCheckBox.is(":checked")) { 
     $("input:text" + groupSelector).attr("required", "required"); 
     $("input[type='mail']" + groupSelector).attr("required", "required"); 
    } else { 
     $("input:text" + groupSelector).removeAttr("required"); 
     $("input[type='mail']" + groupSelector).removeAttr("required"); 
    } 
}