Search jQuery

jQuery Forum

Using jQuery UI

simonzzz

How to select a radio button?

Answered

Need more info
Working on it
Answered

in Using jQuery UI • 9 years ago

Hi all,

I seem to be missing something really really basic. I can't cause a jQuery-ui radio button to display as checked using script. Eg: I use the simple example code on the Button page which has several radios that form a buttonset. Then I execute the following on it:

$('#radio3').val("test");
$('#radio3').attr("checked","checked");

The result is that the underlying radio button becomes checked but the UI does not change: to the user it still looks unselected. Is there any way to script the selection of such a radio button so that it actually appears selected?

Thanks for any help!

Simon

Replies(10)

elubin

Re: How to select a radio button?

9 years ago

i'm not sure i fully understand your example, but try

$('#radio3').click();

ajpiano

Re: How to select a radio button?

9 years ago

After you set the checked attribute, try triggering a change event on the radio (.change()) and see if that causes a visual change to the button.

simonzzz

Re: How to select a radio button?

9 years ago

Thanks for the responses, but nothing suggested so far works. I'm sure there's a simple answer.

After spending 2 hours trying to figure this out I spent 1 hour and rolled my own component, which I think will work better for me anyway.

fabre.lam..

Re: How to select a radio button?

9 years ago

I'm having the same problem, and as simonzzz, cannot make it work.

I also tried the jquery field plugin to set the radio button value, but the UI does not refresh.

I really think there should be a method .setValue() on buttonset that allows setting a value programmatically.

Or even better, get the buttonset to listen to value change events and react accordingly.

Otherwise, trying to populate a form from values returned by a server is a nightmare!

And triggering a .click() is not a good idea. There might be submit methods attached to that element...

rdworth

Re: Re: How to select a radio button?

9 years ago

Since 1.8rc3 (in trunk) we've added a .button("refresh") method. This can be used when the disabled or checked state changes, including when a form is reset. Unfortunately we don't have any way to listen for these attributes to change as change is not triggered in most cases. In cases where change is triggered we are now listening for it, so there are some instances where you won't need to call refresh.

Tickets:

http://dev.jqueryui.com/ticket/5261

http://dev.jqueryui.com/ticket/5278

http://dev.jqueryui.com/ticket/5324

fabre.lam..

Re: How to select a radio button?

9 years ago

Is that method available on the buttonsets themselves, or do I need to iterate over all radio buttons individually?

I've tried calling $(':radio').button('refresh') after setting the radio value (with jQuery field plugin's .setValue() method) and nothing happens...

I've checked with Firebug, and one of the input radio buttons definitely has checked = true

rdworth

Re: Re: How to select a radio button?

9 years ago

I added the refresh method to buttonset this morning. Are you using the trunk version? All these changes are only in trunk.

fabre.lam..

Re: How to select a radio button?

9 years ago

Oh sorry, I misread you. I thought you meant it was in the full 1.8rc3, which I downloaded just a few days ago.

I've downloaded jquery.ui.button.js from trunk, loaded it after the main jquery-ui one and it does seem to work now. I'll test it fully later on on my dev machine.

davividal

Re: How to select a radio button?

7 years ago

Hi.

I know that this is a 'bit' old topic, but what I did when I need to solve an issue like this was trigger the click action: $(':radio:checked').trigger('click'); after set the radio value with $(':radio[name=my_radio]').val('my_value');