Botón de opción Bootstrap: obtenga el valor seleccionado al enviar el formulario

Tengo los siguientes botones de opción de Bootstrap:

<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>

Estoy tratando de obtener el valor del botón activo cuando envío el formulario, sin crear un onclick evento, simplemente obteniendo el botón activo de la $('#filterDay') grupo de botones Debería ser fácil, pero no encontré una manera de obtener el valor. Intenté varios ejemplos, pero todos no funcionaron.

Actualizar:

Este es el código HTML “impreso”:

<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>

El active valor en el class El atributo es lo que cambia cuando hago clic en el botón.

En el controlador de envío de formulario, use el :checked selector.

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

Debe establecer un común name atributo para identificar el formulario:

<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>

Y para obtener el valor de esta manera:

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

Prueba esto:

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

Consulte la documentación de jQuery para obtener más información sobre :checked seleccionador y .val atributo.

Algún problema de lógica está en el código:

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

La etiqueta tiene la active class, por lo que Bootstrap lo mostrará como activo pero la radio de entrada contenida no está marcada, por lo que en HTML puro, no está marcada.

Código correcto:

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

Usa jQuery :checked selector.

Usa jQuery .prop() atributo, así:

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