0

合計 jQuery n00b。チェックボックスの2つのカテゴリ/グループを持つ次の（簡略化された）フォームがあります（他のすべての入力を省略しています）：

<form id="myForm" method="post">
    Category 1:
    <input type="checkbox" name="check1" id="check1" value="1" />
    <input type="checkbox" name="check2" id="check2" value="2" />
    ...
    Category 2:
    <input type="checkbox" name="check3" id="check3" value="3" />
    <input type="checkbox" name="check4" id="check4" value="4" />
    <input type="submit" />
</form>

送信後にカテゴリ 1 でチェックボックスがチェックされていない場合、またはカテゴリ 2 でチェックボックスがチェックされていない場合、クライアント側の検証エラーをスローしようとしています。

繰り返しますが、jQuery n00b であるため、ポップアップ ボックスにエラーをスローする例をいくつか見てきました。ただし、jquery.unobtrusive.validation を使用して設定された検証エラー<div>でエラーがスローされるようにする必要があります (正確な名前を思い出せません)。また、名前がすべて異なるため、簡単な例をいくつか使用することができません。

私のモデルでは、ASP.net MVC を使用して、チェックボックスは実際にはブール値です (このインスタンスではチェックボックス リストを使用できません)。したがって、私は実際にコードを持っています:@Html.Checkbox(m => m.Model.Check1)などを私の.cshtml見解に入れます。私はそれが関連しているとは思わない。しかし、私は間違っている可能性があります。

4

2 に答える 2

1

1 つの方法は、1 つのクラスをチェックボックスの最初のグループ (たとえば) に与えcategory1、別のクラスを 2 番目のグループ ( など)に与えることcategory2です。次に、次のようなことをします

$("#myForm").submit(function() {
    if ($(".category1:checked").length == 0 || $(".category2:checked").length == 0) {
        $("#errormessage").append("<p>You must check at least one checkbox in each category!</p>"); // Or however you want the validation error to be displayed
        return false;
    }
});

divただし、各グループのチェックボックスの周りに a または他のコンテナー要素を配置し、各 div に独自のクラスまたは ID を与えることで、繰り返しが少なくなります (したがって.category1、カテゴリ 1 の.category2すべてのチェックボックスを含む 1 つの div と、すべてのチェックボックスを含む 1 つの div があります)。カテゴリ 2)。次に、セレクターとして $(".category1 :checked") と $(".category2 :checked") を使用します。

于 2013-02-22T19:15:37.717 に答える
1

最も簡単な方法:

if ($('#check1,#check2').filter(':checked').length <= 0 || 
         $('#check3,#check4').filter(':checked').length <= 0) {
   // error message
}

このフォームを正確にどのように検証しているかについての有用な詳細を投稿していないため、残りは自分で把握する必要があります.

于 2013-02-22T19:05:27.617 に答える