CODEWITHSUNDEEP
twitter-bootstrap-3
Rich P
Rich P

Reputation: 381

Bootstrap 3 data-toggle buttons-radio

It seems buttons-radio no longer works in Bootstrap 3

<div class="btn-group" data-toggle="buttons-radio">
    <button class="btn btn-default" value="1" type="button" >1</button>
    <button class="btn btn-default" "value="2" type="button" >2</button>
</div>

It has been replaced with radio button inputs. Is there any way to bring back the only one button allowed to be checked in a group with buttons? I need to be able to have the group be totally unpicked after one item has been selected so radio buttons won't do.

This ended up being the answer for me to keep using buttons in a radio type in BS3:

$(this).addClass("current").siblings().removeClass("active");

Upvotes: 18

Views: 60108

Answers (4)

Davide
Davide

Reputation: 614

Add input type="radio" inside tab:

<a href="#prices" class="btn btn-default active" data-toggle="tab">
    <input type="radio">Prices
</a>

Upvotes: 5

Jaider
Jaider

Reputation: 14884

Add 

 data-toggle="button"

to each radio button

Source http://labs.thecssninja.com/bootleg/index.html#buttons

Upvotes: 6

Rich P
Rich P

Reputation: 381

This ended up being the answer for me to keep using buttons in a radio type in BS3:

$(this).addClass("current").siblings().removeClass("active");

Upvotes: 10

Carol Skelly
Carol Skelly

Reputation: 362370

Could you give all of the radio's the same name=? Then they'll toggle each other..

<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio1" value="option1"> 1
</label>
<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio2" value="option2"> 2
</label>
<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio3" value="option3"> 3
</label>

Demo: http://bootply.com/75922

Upvotes: 8

Related Questions