Make a new section appear when radio button is clicked.

[Former Community Member]

Hello

My form has three mutually-exclusive radio buttons.

When the user clicks the first button, he just continues filling out the form.

However, should the user click the 2nd or 3rd buttons, he just goes to another section and fills it out.

I would like a new section to appear on the form in which the user must enter a "justification" for clicking on these buttons.

I think this would look so much nicer than clogging up a form with sections and text fields that are not needed unless a condition is met.

We learned a very basic way to hide things (colored boxes) and make them visible, but the training did not cover anticipated real-life use of this method so we don't know exactly what to do and how to do it.

Any and all help is always appreciated!

thanks

MARLA

[Former Community Member]

Hi Marla,

Here is a quick example that i've put together which should help you, i've created 3 radio buttons side by side (so they are linked at there parent radiobuttongroup node which i've called "seeme"), and have named them "nothing", "show1" and "show2" (so the rawValue's of these will be 1, 2 and 3 respectively).  These are on a Subform called MAIN with any other fields that everyone will need to complete.

I then have another 2 subforms, one subform called SHOW1 and the last called SHOW2 (each labelled so they are with their respective radio buttons - although you can call them what they like).

The subforms SHOW1 and SHOW2 will need to be set to hidden, you can either do this through object properties, or via JavaScript on the initialize event of each of the subforms to say: this.presence="hidden";

The form must be saved as a Dynamic XML Form.

The code says if their is no selection or "nothing is selected" don't show the extra subforms, but if "show1" is selected (rawValue of 2) then show the "SHOW1" subform, and is "show2" is selected (rawValue of 3) then show the "SHOW2" subform.

Please the following code On the CHANGE event of the radiobuttongroup node (seeme):

if (MAIN.seeme.rawValue==2)
{
SHOW1.presence="visible";
SHOW2.presence="hidden";
}
else if (SF_HEADER.seeme.rawValue==3)
{
SHOW2.presence="visible";
SHOW1.presence="hidden";
}
else
{
SHOW1.presence="hidden";
SHOW2.presence="hidden";
}

Hope this helps,

Jay