フォームには次の部分があります。
<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ブログで行われています
では、これはどのように行われるのでしょうか、および/または私は何を間違えたのでしょうか?