Twitter Bootstrap: Pobierz przyciski wyboru stanu bootstrap

Question

Jak uzyskać "stan" przycisków, które zostały wciśnięte w bootstrap?

tj. Używam tego kodu, który sprawia, że ​​przyciski „przełącznik” niczym wyboru:

<div class="btn-group" data-toggle="buttons-checkbox"> 
    <button type="button" class="btn btn-primary">Left</button> 
    <button type="button" class="btn btn-primary">Middle</button> 
    <button type="button" class="btn btn-primary">Right</button> 
</div> 

Który jest od the bootstrap manual here.

ale które ja następnie kliknij przycisk Prześlij - nie ma danych zawartych w $ _POST. Skąd mam wiedzieć, które przyciski zostały wybrane?

Próbowałem dodać 'value="1" name="1"' itp. Do przycisków - ale wciąż nic.

Edytuj: Oto pełne rozwiązanie, które udało mi się stworzyć przy pomocy pomocy Felixa poniżej.

<form method="post" action="" id="mform" class="form-horizontal"> 
<div class="btn-group" data-toggle="buttons-checkbox"> 
    <button type="button" name="left" value="1" class="btn btn-primary">Left</button> 
    <button type="button" name="middle" value="1" class="btn btn-primary">Middle</button> 
    <button type="button" name="right" value="1" class="btn btn-primary">Right</button> 
</div> 
<button type="submit" class="btn">Submit</button> 
</form> 

<script> 
    $('#mform').submit(function() { 
     $('#mform .btn.active').each(function() { 
      var input = document.createElement("input"); 
      input.setAttribute("type", "hidden"); 
      input.setAttribute("name", this.name); 
      input.setAttribute("value", this.value); 
      document.getElementById("mform").appendChild(input); 
     }); 
    }); 
</script> 

Answer 1

Przyciski, które są „wybranych” będzie miał klasę active dołączone do nich. Następnie możesz użyć jQuery, aby wybrać tylko te przyciski. Od button s są elementami formularza, mogą mieć atrybuty name i value i prawdopodobnie najlepiej z nich korzystać.

Przykład:

var data = {}; 

$('#myButtonGroup .btn.active').each(function() { 
    data[this.name] = this.value; 
}); 

Aby wysłać dane do serwera, to można użyć Ajax i ustawić dane ręcznie/łączyć go z innymi danymi formularza (jeśli istnieje).

Możesz również spróbować odzwierciedlić wartości w ukrytych elementach formularza, jeśli chcesz użyć "tradycyjnego" formularza (zobacz Change form values after submit button pressed).

Answer 2

możesz użyć stanu metody przełącznika bootstap, aby uzyskać bieżący stan.

var data = {}; 

$('#myButtonGroup .btn.active').each(function(index,element) { 
    data[this.name] = jQuery(element).bootstrapSwitch('state') 
});