javascript - Read radio button value on button-grp toggle -
this follow question how toggle button in button-group on page load in bootstrap3 jquery
i'm trying read value of radio in button group. i'm able read value on click of button, not on change trigger.
<body> <div class="btn-group" data-toggle="buttons"> <label class="btn btn-default"> <input type="radio" name="environment" id="staging" value="staging" />staging </label> <label class="btn btn-default"> <input type="radio" name="environment" id="production" value="production" />production </label> </div> <button class="get-active">get active</button> <script> $(document).ready(function() { $("#production").parent().button('toggle'); }); $('.get-active').click(function() { var active = $('.btn-group').find('.active input').val(); alert( active ); }); $("#staging").parent().on('change', function(){ var active = $('.btn-group').find('.active input').val(); alert( active ); }); </script> </body> here plunker - http://plnkr.co/edit/qwgyxnqnczbgtfmhqey5?p=preview
on click toggle staging production, shows alert undefined, clicking button shows staging.
the problem here think .active input class has not been added when change fired. gets added later on. does't find value. dont if solution works this. define class button. example:
<label class="btn btn-default"> <input type="radio" name="environment" id="staging" class="radioclass" value="staging" />staging </label> <label class="btn btn-default"> <input type="radio" name="environment" id="production" class="radioclass" value="production" />production </label> then in jquery call change on class
$('.radioclass').on('change', function(){ var active = $(this).val(); alert( active ); });
Comments
Post a Comment