jquery - jquery経由でラジオを検証する方法[必須]

Question

10 グループのラジオがあります。各グループには 2 つまたは 3 つ以上のラジオがありますが、それは問題ではありません。各グループから少なくとも 1 つの無線を選択する必要があります。

フォームを送信すると、それらのいずれか（グループ）が空白のままになっている場合は、チェックしてエラーを返す必要があります。

いくつかのコードを試してみましたが、解決できませんでした。エラーを見つけて表示するためにこのコードを書きましたが、1つずつ見つけて、1つがいっぱいの場合はフォームを送信します。

 $('#myForm').submit(function () {

     $(".radiogrup").each(function () {
         var sel = $(this).find("input[type='radio']:checked").val();

         if (sel == null) {
             alert("error msg");
             return false;

         }

     });


 });

html:

required="required" の設定方法を知っていれば、おそらくそれを使用できます。

<div class="radiogrup">
    <form id="form1" name="form1" method="post" action="">
      <p>
        <label>
          <input type="radio" name="RadioGroup1" value="radyo" id="RadioGroup1_0" />
          Radyo</label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="radyo" id="RadioGroup1_1" />
          Radyo</label>
        <br />

        <input name="" type="submit" />
      </p>
    </form>
</div>

Answer 1

function ValidateRadioButtons() {  //Function for Validating If Radio Button isselected
     var ischecked = false;
    $('.radiogrup').children('radio').each(function () {   //LoopingthroughradioButtons
    // "this" is the current element(radio) in the loop
      if ($(this).is(':checked')) {
          ischecked = true; //Radio Button is Checked
        }
    });
   if (ischecked == true) {
    alert("Validation Passed");
    }
   else {
    alert("Please select a Radio Button");
  }
}

Answer 2

この方法で JS コードを修正してみてください。

$('form').on("submit",function () {
    var valid=true; 
    $(".radiogrup").each(function(){
        var sel=$(this).find("input:radio:checked");
         if(!sel.length){
             valid=false;
         }
    });
    if(!valid){
        alert("error msg"); 
        return false;
    }

});

これを参照してください：http://jsfiddle.net/32aew/

Answer 3

これは、これに $.each を使用しないのに役立つ可能性があります

$('#myForm').submit(function () {    
var $elems = $(".radiogrup");

        (function fetch(i) {
            if(i >= $elems.length) return;  // no elems left

            var $elem = $elems.eq(i);

            var sel = $($elem).find("input[type='radio']:checked").val();
            if (sel == null) {
                     alert("error msg"); // just don't call fetch again
            }
            else
            {
                 fetch(i + 1); //next one
                 //apply more code here if form validation successfull
            }
        })(0);  // start with first elem
});

Answer 4

このコードはあなたのために働きます

//jQuery

$(function(){

 $('#myForm').submit(function () {
         if ($('input[type=radio]:checked').val() != "") {
             return true;
         }

alert('error msg')
return false

     });
})

//HTML

<form id="myForm" name="form1" method="post" action="">
      <p>
        <label>
          <input type="radio" name="RadioGroup1" value="" id="RadioGroup1_0" />
          radyo
          </label>
        <br />
        <label>
          <input type="radio" name="RadioGroup1" value="radyo" id="RadioGroup1_1" />
          Radyo</label>
        <br />

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