2

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" />

group-nameという属性を作成しましたが、セクション内のすべてのフィールドが同じgroup-nameを共有しています。そして、FrédéricHamidi氏（以下の議論で）の助けを借りて、私の機能を変更しました。これが最新バージョンです：

  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（）の構文について誰かが私を助けてくれるなら、カスタム検証メソッドを作成することができます-それはありがたいです。

論理を理解するのを手伝ってくれたFrédéricHamidi氏に特に感謝します。

誰かが興味を持っている場合は、より詳細なチュートリアルを作成しました@ http://www.logicwizards.net/2010/12/07/jquery-tools-custom-validator-mod/

ジョーネグロン：ロジックウィザード〜NYC

4

1 に答える 1

3

チェックボックスが一致するので、ではなく、に$('#'+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");
    }
}
于 2010-12-06T20:22:52.597 に答える