detect radio/checkbox 'checked' states in jquery UI. Underlying buttons don't update

Question

I'm using the jQuery UI button widget in a form that I need to validate for some radio/check box elements.

According to the demo in the provided link -

Their (the original elements) associated label is styled to appear as the button, while the underlying input is updated on click.

if you inspect even the example page I provided the underlying button elements do not get updated with anything. Note - the middle radio button in the example is checked by default.

I am using the following code to detect button states - oddly enough its always true (figured it'd be false).

$el = $("#someCheckbox");
if($el.attr('checked')){ //do stuff }

It looks like I can get the button state from the label jquery ui uses as the button style (a la class="ui-state-active), but I would like to avoid reading labels and stick to validating the actual radio buttons.

---

Am I pulling the form data wrong by accessing the original radio button?

OR

Is this potentially a bug in the jquery ui butotn widget?

Answer 1

Just checked the demo pages at jqueryui.com. Looks like it works just ok there. However let jQuery decide if the input is checked. Try

$el = $("#someCheckbox");
if( $el.is(':checked') ){ //do stuff }

Hope that helps.