web-dev-qa-db-de.com

Optionsfeld "Bootstrap": Ruft den ausgewählten Wert im Formular ab

Ich habe den nächsten Radiobutton:

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

Ich versuche, den Wert der aktiven Schaltfläche beim Senden des Formulars abzurufen, ohne ein "Onclick" -Ereignis zu erstellen. Es wird einfach die aktive Schaltfläche aus der $ ('# filterDay') - Tastengruppe abgerufen. Sollte einfach sein, aber ich finde keinen Weg, um den Wert zu erhalten. Ich habe mehrere Beispiele ausprobiert, aber alle haben funktioniert.

Könnte jemand helfen?

Vielen Dank!

Update:

Dies ist der HTML-Code "gedruckt":

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

Das "Aktiv" in der Klasse ändert sich, wenn ich auf die Schaltfläche klicke.

16
Oscar Mateu

Verwenden Sie im Formular zum Senden des Handlers den : checked Selector

var filterDay = $('#filterDay input:radio:checked').val()
28
Arun P Johny

Probieren Sie es aus, es sollte Ihr Problem lösen.

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

sie können den Link unten für weitere Details beziehen:
http://api.jquery.com/checked-selector/

2
user3292306

Sie sollten einen allgemeinen "Namen" angeben, um das Formular zu identifizieren:

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

Und um den Wert zu erhalten, können Sie Folgendes erhalten:

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

Irgendein logisches Problem im Code ...

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

Label hat die aktive Klasse, so dass Bootstrap sie als aktiv anzeigt, aber das enthaltene Eingabe-Radio wird nicht geprüft, also wird es in pure HTML nicht geprüft.

Code korrigieren ...

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