11

同じ質問を持つ他の投稿をいくつか見ましたが、解決策が得られなかったため、独自の質問を投稿しています。

私は JQuery と MVC を初めて使用することから始めましょう。3 つのチェックボックスがあり、そのうちの少なくとも 1 つがオンになっていることを確認する必要があります。Jquery カスタム検証を使用して動作しているものがあります。しかし、検証の概要に 3 つのメッセージが表示されています。メッセージを 1 つだけ表示し、可能であれば検証の概要には表示しないでください。どうすればこれを達成できますか？

htmlコード

<label for="river1">river1</label>
<input checked="checked" class="checkbox" data-val="true" data-val-required="The     river1 field is required." id="river1" name="river1" type="checkbox" value="true" />
<input name="river1" type="hidden" value="false" /><br />

<label for="river2">river2</label>
<input checked="checked" class="checkbox" data-val="true" data-val-required="The river2 field is required." id="river2" name="river2" type="checkbox" value="true" />
<input name="river2" type="hidden" value="false" /><br />

<label for="river3">river3</label>
<input checked="checked" class="checkbox" data-val="true" data-val-required="The river3 field is required." id="river3" name="river3" type="checkbox" value="true" />
<input name="river3" type="hidden" value="false" /><br />

JQuery

$.validator.addMethod("checkbox", function (value, element) {
  return $('.checkbox:checked').length > 0;
  }, 'At least one river must be selected.');
4

1 に答える 1

15

実際のデモ http://jsfiddle.net/RGUTv/

更新- 2015 年 1 月 12 日 => http://jsfiddle.net/r24kcvz6/ CDN が変更されましたhttp://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js - 複製できますすべてのチェックボックスの選択を解除してsubmitボタンをクリックすることで動作します。

コード

$.validator.addMethod('require-one', function(value) {
    return $('.require-one:checked').size() > 0;
}, 'Please check at least one box.');

var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e, i) {
    return $(e).attr("name")
}).join(" ");

$("#itemForm").validate({
    groups: {
        checks: checkbox_names
    },
    errorPlacement: function(error, element) {
        if (element.attr("type") == "checkbox") error.insertAfter(checkboxes.last());
        else error.insertAfter(element);
    }
});

html

<form name="itemForm" id="itemForm" method="post">

<label for="river1">river1</label>
<input checked="checked" data-val="true" data-val-required="The     river1 field is required." id="river1" name="river1" type="checkbox" value="true" class="require-one" />
<input name="river1" type="hidden" value="false" /><br />

<label for="river2">river2</label>
<input checked="checked" data-val="true" data-val-required="The river2 field is required." id="river2" name="river2" type="checkbox" value="true" class="require-one" />
<input name="river2" type="hidden" value="false" /><br />

<label for="river3">river3</label>
<input checked="checked" data-val="true" data-val-required="The river3 field is required." id="river3" name="river3" type="checkbox" value="true" class="require-one" />
<input name="river3" type="hidden" value="false" /><br />

<input type="submit" />
</form>

チェックを外した場合の画像は、検証がトリガーされます

ここに画像の説明を入力

于 2012-07-16T21:10:24.913 に答える