Wie programmatisch

Question

http://jsfiddle.net/rphpbqp9/

<div class="btn-group" data-toggle="buttons"> 
    <label class="btn btn-sm btn-primary success active"> 
     <input type="radio" name="options" id="optionFalse" checked />false 
    </label> 
    <label class="btn btn-sm btn-primary danger"> 
     <input type="radio" name="options" id="optionTrue" />true 
    </label> 
</div> 

$('#optionTrue').button('toggle'); 

ich gelesen habe mehr Fragen Antworten eine Bootstrap-Taste Gruppe (Radio), um zu überprüfen, aber keiner von ihnen arbeitet. Die Schaltfläche toggle funktioniert nicht, ich habe versucht, "aktive" Klasse hinzufügen/entfernen, hat keinen Effekt. Ich benutze 1.10 jQuery und 3.1 Bootstrap. Das soll einfach sein, ich ziehe mir die Haare aus!

Answer 1

button()btn auf das Element mit der Klasse aufgerufen werden muss ...

$('#optionTrue').closest('.btn').button('toggle'); 

Diese die Tasten richtig und aktualisiert die überprüften Eigenschaften jeder Eingabe richtig ...

Fiddle

schalten wird

Answer 2

Es ist verrückt die bootstrap docs (3.2) machen dies nicht offensichtlicher, aber hier ist die einfachste Methode, die ich gefunden habe, um den Ausgangszustand von Radio-Buttons in Code zu setzen.

<div class="btn-group" data-toggle="buttons"> 
    <label id="optionFalse" class="btn btn-primary"> 
     <input type="radio" name="options" /> false 
    </label> 
    <label id="optionTrue" class="btn btn-primary "> 
     <input type="radio" name="options" /> true 
    </label> 
</div> 

if (initTrue) { 
    $('#optionTrue').button('toggle'); 
} 
else { 
    $('#optionFalse').button('toggle'); 
} 

Nach Dutzenden von Beiträgen zu diesem Thema zu lesen, scheint es diese die allgemeinen Punkte der Verwirrung sind:

• Die ‚Toggle‘ Methode nicht zwischen Staaten nicht hin- und herzuschalten (off-> auf -> off), wie man es erwarten könnte, sondern setzt den referenzierten Button einfach auf "on" und schaltet alle anderen Buttons aus.
• Die ID, auf die verwiesen wird, muss auf der 'Bezeichnung' und nicht auf der 'Eingabe' stehen.

Answer 3

http://jsfiddle.net/y5qccerz/

document.querySelector(".btn-group input[id='optionTrue']").checked = true;