1

My jQuery Radioset won't remove the checked-attribute when changing the radiobutton programatically. As only one radio button can be selected by its natural behavior I expect that the previous selected button will be unchecked. Am I right here?

To demonstrate it, I've created a simple jsfiddle: http://jsfiddle.net/nL8ksLwt/

html:

<div id="radioset">
    <input type="radio" id="174928" name="freq">
    <label value="174928" class="tooltip" for="174928">5A</label>
    <input type="radio" id="176640" name="freq">
    <label value="176640" class="tooltip" for="176640">5B</label>
</div>
<button id="trigger">Trigger Change Event 5A</button>
<button id="trigger2">Trigger Change Event 5B</button>

js: 

  $(function () {
      $("#radioset").buttonset();
  })
   $('#trigger').click(function () {
      $("#174928").attr('checked', true);
  });

  $('#trigger2').click(function () {
      $("#176640").attr('checked', true);
  });

I am using firefox. On the webpage it does work but if you take a look at firebug you'll see that the checked-attribute is still there. This results in problems with my other functions.

The main goal is to select another radiobutton programatically so that only one button at a time is selected (without firing onchange-events). How to do it the right way?

bademeister
  • 107
  • 1
  • 11

2 Answers2

3

Reason for not working:

  • attr is string based.
  • prop is boolean based.
  • So for radio,checkbox we can use prop. other text based elements you can use attr.

Try Use prop instead of attr it ill work

JsFiddle : http://jsfiddle.net/nL8ksLwt/3/

  $(function() {
    $( "#radioset" ).buttonset();
  })
$('#trigger').click(function(){
    $("#174928").prop("checked", true);
});

$('#trigger2').click(function(){
    $("#176640").prop("checked", true);
});
Andi AR
  • 2,678
  • 2
  • 23
  • 28
1

You can also trigger the click event on the radio button.

  $("#radiobutton").click();

here is the fiddle

Overmachine
  • 1,723
  • 3
  • 15
  • 27