Question

$('#customer_details_table').find("input").each(function(i, obj) {
        if (obj.checked == true) {
            var customer_id = obj.id;
        } else {
            alert('Need to select atlease one radio button');
            event.stopImmediatePropagation();
        }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="table table-striped table-bordered table-hover dataTable" id="customer_details_table" aria-describedby="sample_1_info" style="display: table;">
   <thead>
      <tr>
         <th></th>
         <th>Customer Name</th>
         <th>Address</th>
         <th>Contact No.</th>
         <th>Email</th>
         <th>Action</th>
      </tr>
   </thead>
   <tbody class="odd gradeX">

      <tr>
         <td><label class="radio"><input type="radio" class="bradio" id="20" name="optionsRadios1" value="option1"></label></td>
         <td width="20%">kiran</td>
         <td width="25%">XXXXXXX</td>
         <td width="20%">7654321987</td>
         <td width="20%">venkatrajkiran@yahoo.com</td>
         <td width="10%" align="center"><span class="label label-inverse">DeActive</span></td>
      </tr>

      <tr>
         <td><label class="radio"><input type="radio" class="bradio" id="28" name="optionsRadios1" value="option1"></label></td>
         <td width="20%">kiran</td>
         <td width="25%">XXXXXXX</td>
         <td width="20%">9701429843</td>
         <td width="20%">s@g.com</td>
         <td width="10%" align="center"><span class="label label-inverse">DeActive</span></td>
      </tr>

   </tbody>
</table>

单击“激活”按钮时，我需要检查是否检查了任何单选按钮？

即使我选择了一个单选按钮，它还会进入其他状态??

<table class="table table-striped table-bordered table-hover dataTable" id="customer_details_table" aria-describedby="sample_1_info" style="display: table;">
   <thead>
      <tr>
         <th></th>
         <th>Customer Name</th>
         <th>Address</th>
         <th>Contact No.</th>
         <th>Email</th>
         <th>Action</th>
      </tr>
   </thead>
   <tbody class="odd gradeX">

      <tr>
         <td><label class="radio"><input type="radio" class="bradio" id="20" name="optionsRadios1" value="option1"></label></td>
         <td width="20%">kiran</td>
         <td width="25%">XXXXXXX</td>
         <td width="20%">7654321987</td>
         <td width="20%">venkatrajkiran@yahoo.com</td>
         <td width="10%" align="center"><span class="label label-inverse">DeActive</span></td>
      </tr>

      <tr>
         <td><label class="radio"><input type="radio" class="bradio" id="28" name="optionsRadios1" value="option1"></label></td>
         <td width="20%">kiran</td>
         <td width="25%">XXXXXXX</td>
         <td width="20%">9701429843</td>
         <td width="20%">s@g.com</td>
         <td width="10%" align="center"><span class="label label-inverse">DeActive</span></td>
      </tr>

   </tbody>
</table>

       <button type="button" id="deactivebtn" class="btn blue" style="display: inline-block;">Activate</button>


$(document).on('click', '#deactivebtn', function(event) {
    $('#customer_details_table').find("input").each(function(i, obj) {
        if (obj.checked == true) {
            var customer_id = obj.id;
        } else {
            alert('Need to select atlease one radio button');
            event.stopImmediatePropagation();
        }
    });

});

有人可以帮我解决这个问题吗？

Answer 1

你得到＆＃34;需要选择一个单选按钮＆＃34;因为你正在检查所有的无线电输入，所以总会有一个未经检查的消息。

使用find(":radio:checked")选择器改进了代码版本：

$(document).on('click', '#deactivebtn', function(event) {
    var $checked = $('#customer_details_table').find(":radio:checked");
    if (!$checked.length) {
        alert('Need to select atlease one radio button');
        event.stopImmediatePropagation();
    }
    else {
        var customer_id = $checked[0].id;
        alert(customer_id)
    }
});

演示：http://jsfiddle.net/3ppjfcLa/

Answer 2

只需要检查是否有任何单选按钮被选中：

$(document).on('click', '#deactivebtn', function (event) {    
     if ($('#customer_details_table input[type=radio]:checked').length) {
         var customer_id = $('#customer_details_table input[type=radio]:checked').prop('id');
         alert("Selected: " + customer_id);
     } else {
         alert('Need to select atlease one radio button');
         event.stopImmediatePropagation();
     }
});

<强> DEMO

Answer 3

两个单选按钮都会调用该函数。因此，即使您选中一个单选按钮，另一个单选按钮也会转到其他状态

最好使用单选按钮的value属性来存储rathar而不是id属性

的值

Answer 4

尝试类似：

$(document).on('click', '#deactivebtn', function(event) {
    if ( $('input[name=optionsRadios1]:checked', '#myForm').length>0 )  {
            var customer_id = obj.id;
        } else {
            alert('Need to select atlease one radio button');
            event.stopImmediatePropagation();
        }
    });
});

Answer 5

JS：

<script type="text/javascript">

        $(document).ready(function(){
            $radio_selected=false;
            $("#deactivebtn").bind('click',function(event){
                var radio_selected=false;
                $('#customer_details_table').find(":radio").each(function(i, obj) {
                    if (obj.checked === true) {
                        var customer_id = obj.id;
                        radio_selected=true;
                    } else {
                        if(i==2-1 && !radio_selected){
                            alert('Need to select at least one radio button');
                            event.stopImmediatePropagation();
                        }
                    }
                });
            });
        });
    </script>

HTML保持不变。

Answer 6

@preethi jain你的代码在这里

$(document).on('click', '#deactivebtn', function(event) {
    event.stopPropagation();
    var checked = $("input[name='optionsRadios1']:checked");
    alert(checked.attr('id'));
});

Demo结帐链接

如何在单击提交按钮时检查是否选中了任何单选按钮

6 个答案:

演示：http://jsfiddle.net/3ppjfcLa/