javascript - BOOTSTRAP RADIO BUTTON with css skin in 2 different panels doesn't work -
i have this: https://jsfiddle.net/8p984uc0/
its 2 different bootstrap panels. (i had 30 panels in final page) - simplify..
i made stylish radio button using:
<label class="btn btn-success-on btn-success-inv bk-fg-white btn-sm bk-rd-off bk-bd-success" style="width: 90px; max-width: 90px;"> <input type="radio" name="choice2" id="choice2" value="1" /><i class="fa fa-thumbs-o-up"></i> choice 01!</label>
my problem:
with style in radio if put in different panels - radio buttons doesnt work. (i check radio 1 - , check radio 2 - , radio 1 continues checked)
if put booth in same panel, no problem. (if check radio 1, , check radio 2 - radio 1 unchecked).
whats wrong?
tks!!
1- https://jsfiddle.net/8p984uc0/2/ radios in same panel, works fine.
when put them in same panel put them in same button group, think that's point.
this example of first fiddle working, though stile broken.
<div class="btn-group" data-toggle="buttons"> <div class="panel bk-widget bk-bd-off bk-chrome-fix col-lg-4 col-md-4 col-sm-4 col-xs-4"> ... </div> <div class="panel bk-widget bk-bd-off bk-chrome-fix col-lg-4 col-md-4 col-sm-4 col-xs-4"> .... </div> <div>
as can see in 2 different panels, button-group same.
and this example of second fiddle dosn't work, i've put radio buttons in 2 different button groups. i'm not sure need col-lg, col-md, col-sm , col-sx, that's question.
edit: here new fiddle, buttons have right style, , works. changed buttons name choices, makes more sense, , updated css adding
input[name=choices] { display:none }
Comments
Post a Comment