Bootstrap单选按钮：在提交表单上获取选定的值

I have the next boostrap radio-button:

我有下一个boostrap单选按钮：

<div class="btn-group" id="filterDay" data-toggle="buttons">
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="1">Monday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="2"> Tuesday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="3"> Wednesday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="4"> Thursday
       </label>
       <label class="btn btn-default blue">
          <input type="radio" class="toggle" value="5"> Friday
       </label>
       <label class="btn btn-default blue">
           <input type="radio" class="toggle" value="6"> Saturday
        </label>
       <label class="btn btn-default blue active">
           <input type="radio" class="toggle" value="0"> Sunday
       </label>
</div>

I'm trying to get value of the active button when I submit the form, without creating an "onclick" event, simply getting the active button from the $('#filterDay') button group. Should be easy but I'm not finding a way to get the value. I tried several examples but any worked.

我在提交表单时尝试获取活动按钮的值，而不创建“onclick”事件，只需从$（'＃filterDay'）按钮组获取活动按钮。应该很容易，但我找不到获得价值的方法。我尝试了几个例子但是有效。

Could someone help?

有人可以帮忙吗？

Thank you!

谢谢！

Update:

更新：

This is the html "printed" code:

这是html“打印”代码：

<label class="btn btn-default blue">
   <input type="radio" class="toggle" value="6"> Saturday
</label>    
<label class="btn btn-default blue active">
        <input type="radio" class="toggle" value="0"> Sunday
</label>

The "active" in the class is what is changing when I click the button.

当我点击按钮时，班级中的“活动”就会发生变化。

6 个解决方案

#1

In the form submit handler use the :checked selector

在表单提交处理程序中使用：checked选择器

var filterDay = $('#filterDay input:radio:checked').val()

#2

Try this out, It should solve your problem.

试试这个，它应该解决你的问题。

$( "input:checked" ).val()

you can refer the link below for more details:
http://api.jquery.com/checked-selector/

您可以参考以下链接了解更多详情：http：//api.jquery.com/checked-selector/

#3

Some logic problem in the code...

代码中的一些逻辑问题......

<label class="btn btn-default blue active">
       <input type="radio" class="toggle" value="0"> Sunday
</label>

Label has the active class so bootstrap will display it as active but the contained input radio is not checked, so in pure html it is not checked.

Label具有活动类，因此bootstrap会将其显示为活动状态，但不会检查包含的输入无线电，因此在纯html中不会检查它。

Correct code...

正确的代码......

<label class="btn btn-default blue active">
       <input type="radio" checked="checked" class="toggle" value="0"> Sunday
</label>

#4

use jquery :checked selector link

使用jquery：选中选择器链接

#5

You should set a common "name" to identify the form:

您应该设置一个通用的“名称”来标识表单：

<div class="btn-group" id="filterDay" data-toggle="buttons">
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="1">Monday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="2"> Tuesday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="3"> Wednesday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="4"> Thursday
   </label>
   <label class="btn btn-default blue">
      <input type="radio" class="toggle" name="toggle" value="5"> Friday
   </label>
   <label class="btn btn-default blue">
       <input type="radio" class="toggle" name="toggle" value="6"> Saturday
    </label>
   <label class="btn btn-default blue active">
       <input type="radio" class="toggle" name="toggle" value="0"> Sunday
   </label>
</div>

And to get the value, you can get like this:

为了获得价值，你可以这样：

$('input[name=toggle]:checked').val()

#6

-2

$('#radioButtonName').prop('checked')

$（ '＃radioButtonName'）。支撑（ '检查'）

this works for

这适用于

#1