[development] Issues with selecting radio buttons with JQuery

[Earl Miles]

Dan Robinson wrote:
> Folks,
> 
> Help appreciated -
> 
> I'm building a node form where the form will reveal/hide portions
> depending on the users choices.  To do this I'm using jQuery to
> manipulate the DOM.  I'm having a lot of issues with the radio buttons.
> 
> What I want to do is have a message pop up if the user selects a
> particular radio button (in this case a "no" choice of a "Yes/No"
> "set").  For this to work I need to attach an "onClick" handle to the
> "no" radio button and when the user clicks evaluate and display the
> message.  Because of a series of interrelated issues I've tried a number
> of approaches.  The one I'm working on now is:
> 
> - I'm using the form APIs "radios" - an issue here is that "radios"
> define the actual radio buttons in an array and it doesn't look like
> there is a way to assign an id attribute using the forms api (as a
> matter of fact there is code in form.inc which explicitly strips out an
> ID at that level).
> - I assign an onClick handler to the "radios" -     #attributes' =>
> array('onClick' => 'CitizenClick()')
> - On form load I assign an id to the specific radio button I'm
> interested in -     $("[name=CitizenQ][value=no]").attr('id',
> 'CitizenNoButton');
> - In CitizenClick() I check and take action depending - if (
> $("#CitizenNoButton").attr('checked') ) {
> - Please note that although I could do all this without an "id" and by
> selecting the "name" instead of the "id" - it was very slow
> 
> Everything works - EXCEPT -
> 
> I am placing the radio buttons inside of a fieldset thusly -
> 
>    $form['Qualifyers'] = array(
>        '#type' => 'fieldset',
>        '#tree' => TRUE,
>        '#weight' => 1,
>    );
>    $form['Qualifyers']['CitizenQ'] = array(
>        '#type' => 'radios',
>          '#title' => t('Are you a U.S. Citizen?'),
>          '#default_value' => 1,
>          '#options' => array('yes' => t('Yes'), 'no' => t('No')),
>        '#attributes' => array('onClick' => 'CitizenClick()'),
>    );
> 
> If I don't place it within the fieldset I can select the radio with -
> 
> $("[name=CitizenQ][value=no]")
> 
> However withing the fieldset I can't get this to work -
> 
> $("[name=Qualifyers[CitizenQ]][value=no]")
> 
> I assumed the above wouldn't work because the "[]" are special
> characters so I tried escaping them -
> 
> $("[name=Qualifyers\\[CitizenQ\\]][value=no]")
> 
> Still no joy - I have been beating my head against this for a while and
> would appreciate some assistance - also if I've approached this in a
> fundamentally wrong way please let me know.

I would recommend setting up a #process so that you can use your own 
version of expand_radios() -- this will let you set things like the 
#name and #id of each individual radio option individually. That could 
allow you to much more easily deal with some of this oddness.