0

メッセージを送信できるフォームがあり、ユーザーはチェックボックスからグループを選択するか、グループ名を手動で入力する必要があります。ここで、このフォームを検証したいのですが、ユーザーがチェックボックスをオンにしなかったり、テキストフィールドに値を挿入しなかったりすると、このフォームは合計できません。

以下は私のフォームで、これが私のjsfiddleです（すでにtextareaを検証しています）。

<form action="" method="post" name="myform" id="myform">

   <input type="checkbox" name="group_list[]" value="1" />Group 1<br />
   <input type="checkbox" name="group_list[]" value="1" />Group 1<br />
   <input type="checkbox" name="group_list[]" value="1" />Group 1<br />
   <input type="checkbox" name="group_list[]" value="1" />Group 1<br />

   <input type="text" name="manual_group" value="" placeholder="Group Name" /><br />

   <textarea name="message" placeholder="Your Message"></textarea> <br />

   <input type="submit" name="submit" value="Send Message" />

</form>

ユーザーは、送信する前にチェックボックスの1つをチェックするか、グループ名を挿入する必要があります。問題は、このルールの条件を作成する方法です。

*このフォームは、チェックボックスの1つをチェックせずに名前を入力しても送信できますが、名前を入力せずにチェックボックスをオンにするとmanual_group、このフォームは合計できます。

4

3 に答える 3

1

これを実現するには、チェックボックスがオンになっていない場合にのみ必要となるルールをテキストボックスに設定します。これは、関数をパラメーターとして受け取る必要な仕様のタイプを使用します。

rules: {
    manual_group: {
        required: function () {
            return $('[name=group_list\\[\\]]:checked').length === 0;
        }
    }
}

他に行う必要があるのは、チェックボックスまたはテキストボックスのいずれかが変更されたときに強制的に再検証することです。私はこのようにそれをしました、

$('form input').on('click focusin focusout keyup', function () {
    $('form').validate().form();
});

完全なスクリプトは以下にあり、このフィドルでは

$(function () {

    $("form").validate({
        rules: {
            manual_group: {
                required: function () {
                    return $('[name=group_list\\[\\]]:checked').length === 0;
                }
            }
        },
        messages: {
            manual_group: "Please check a checkbox or fill in this field"
        },
        submitHandler: function () {
            alert('form ok');
        }
    });


    $('form input').on('click focusin focusout keyup', function () {
        $('form').validate().form();
    });
});
于 2013-02-27T14:37:04.450 に答える
0

あなたのフィドルを参照して

メッセージに追加した検証と同じ方法で追加できます

例えば

"group_list[]": {required:true}...
于 2013-02-27T09:18:40.967 に答える
0

これでうまくいくかもしれません

 $("#submit").click(function(){
        if($('#myform input:checked').length >= 1 || $("#manual_group").val() !=""){
           return true  ;
        }
       return false;   
    }
于 2013-02-27T09:22:13.563 に答える