jQueryフォームValidate Issue

Question

jQuery validateを使用してフォームを検証しています。フォームには3つのフィールドがあります。 1テキストエリア、1チェックボックス、1入力タイプのテキスト。フォームを動的に検証したい、つまりユーザーが入力タイプのテキストにある値を入力したときにチェックボックスとテキストエリアは必要ではないが、ユーザーが値を入力しないと両方が必要な場合。以下のコードを試しました：

$("#form").validate({ 
    rules: { 
    inputTypeText: {required: true}, 
    inputTypeCheckbox: {required: false}, 
    textarea: {required: false}, 
    }, 
    messages: { 
    inputTypeText: "This field is required", 
    inputTypeCheckbox: "This field is required", 
    textarea: "This field is required", 
    }, 
    submitHandler: function(form) { 
     form.submit(); 
    } 
}); 
$('#inputTypeText').keyup(function(){ 
    if($(this).val()==''){ 
    $('input[name="inputTypeText"]').rules('add',{required: false}); 
    $('textarea[name="inputTypeCheckbox"]').rules('add',{required: true}); 
    $('input[name="textarea"]').rules('add',{required: true}); 
    }else{ 
    $('input[name="inputTypeText"]').rules('add',{required: true}); 
    $('input[name="inputTypeCheckbox"]').rules('add',{required: false}); 
    $('textarea[name="textarea"]').rules('add',{required: false}); 
    } 
}); 

以下のスクリーンショットのようにエラーが発生します。

この中で私を助けてください。 ありがとうございます。

Answer 1

jQueryで 'depends'を有効にします。

$("#form").validate({ 
rules: { 
inputTypeCheckbox: { 
    required: { 
    depends: function(element) { 
     return $('#input-field').val().length == 0 
    } 
    } 
}, 
textarea: { 
    required: { 
    depends: function(element) { 
     return $('#input-field').val().length == 0 
    } 
    } 
}, 
}, 
messages: { 
inputTypeCheckbox: "This field is required", 
textarea: "This field is required" 
} 
}); 

このfiddle参照してください：どのように私はこのルールで他のフォーム要素の値を取得することができます