0

フォームには次の部分があります。

<input type="checkbox" class="hide" id="additional-webinar" name="additional-webinar-check" value="additional-webinar-box">
<label class="hide" for="additional-webinar">Include Additional Webinar</label>

<div class="hide" id="additional-webinar-box" style="display:none;">
        <label class="title">Select Additional Webinar</label>
        <select name="additionalWebinarSelection">
            <option value="0" selected="">Please Select</option>
            <option value="173">Del All test(Elite Options Mastery)</option>
            <option value="171">Glob Test(Elite Futures Mastery)</option><option value="169">Test 2(Elite Futures Mastery)</option>
            <option value="167">Test(Elite Futures Mastery)</option><option value="164">Test(Elite Futures Mastery)</option>
            <option value="162">New Min TEst(Elite Futures Mastery)</option><option value="160">Min Height Test(Elite Options Mastery)</option>
            <option value="158">Title Yo(Elite Options Mastery)</option><option value="156">Title(Options Made Easy)</option>
            <option value="96">TT Test(Daily Wealth Report)</option>
        </select>
</div>

チェックボックスがチェックされている場合はdivgetが表示され、チェックされていない場合は非表示になります。

次のバリデーターコードがあります

jQuery('#validate').click(function(){

    jQuery("form").validate({

        rules: {
            additionalWebinar: {
                required: {
                    depends: function() {
                        return jQuery('input[name=additional-webinar-check]').is(":checked")
                    }
                }
            }
        }
    })
});

ただし、select要素には常にオプションが選択されているため、これは常にtrueと評価されます。デフォルトでfalseを返すようにするにはどうすればよいですか。私は以下を試しました:

depends: function() {
    if(jQuery('input[name=additional-webinar-check]').is(":checked")) {
        var input = jQuery('select[name=additionalWebinarSelection]').val();

        if (input == 0) {
            alert(input);
            return false;
        } else {
            return true;
        }
    }
}

しかし、役に立たない。

検証関数を呼び出すことによってトリガーされるコンソールエラーはありません(意図的に呼び出しを強制しています)

これはすべて、公式のjQueryValidatorjQueryプラグインを使用してWordpressブログで行われています

では、これはどのように行われるのでしょうか、および/または私は何を間違えたのでしょうか?

4

1 に答える 1

1

ジョシャ、

AFAIK、Validator apiでは、ルールに要素IDが必要です。select要素のIDとして「additionalWebinar」を追加する必要があります。

jQuery('#validate').click(function(){
jQuery("form").validate({

    rules: {
        additionalWebinar: { // this has to be an Id of an Element
            required: {
                depends: function() {
                    return jQuery('input[name=additional-webinar-check]').is(":checked")
                }
            }
        }
    }
})
});
于 2012-06-01T06:10:57.170 に答える