Adding radio button in Form Personalization

[royat12]

How to add an Option / radio button Field in Form Personalization?

Currently following Field Types are available:

Type:

Choice
Color
Currency
Date-Time
Decimal
Due Date
Duration
HTML
Image
Integer
Journal
List
Price
Reference
String
Suggestion
Time
Translated HTML
Translated Text
True/False
URL
Video


Any inputs appreciated.

[GregJWillis]

I was messing around with trying to make a number of checkboxes behave like a radio button, and thought I would post this solution:

* Create 5 "Yes/No" fields on a form, I called them "u_q1_pick", "u_q2_pick", etc...
* Create 5 "OnChange" ClientScripts where the pick fields for each are selected in the 'Field Name' value
* Paste this in each script: (and change the field values for each to correspond the right CS)
*** notice the use of the ScratchPad. This is needed to set a value to look for once you change the other values...you don't want to create an infinite loop

-------------------------------------
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
if (isLoading || newValue == false) {
return;
}

//Skip if already clearning the checkboxes in-progress
if (g_scratchpad.clearCheckboxes_InProcess != 'true') {

//Set the 'in-process' scratchpad flag
g_scratchpad.clearCheckboxes_InProcess = 'true';

//Clear all the other selections
// ***** this is where you change the q# values to match the right CS *****
// This one is for the 5th pick field OnChange
if (g_form.getValue('u_q1_pick')) g_form.setValue('u_q1_pick', false);
if (g_form.getValue('u_q2_pick')) g_form.setValue('u_q2_pick', false);
if (g_form.getValue('u_q3_pick')) g_form.setValue('u_q3_pick', false);
if (g_form.getValue('u_q4_pick')) g_form.setValue('u_q4_pick', false);

// The 4th would be:
// if (g_form.getValue('u_q1_pick')) g_form.setValue('u_q1_pick', false);
// if (g_form.getValue('u_q2_pick')) g_form.setValue('u_q2_pick', false);
// if (g_form.getValue('u_q3_pick')) g_form.setValue('u_q3_pick', false);
// if (g_form.getValue('u_q5_pick')) g_form.setValue('u_q5_pick', false);

// The 3rd would be:
// if (g_form.getValue('u_q1_pick')) g_form.setValue('u_q1_pick', false);
// if (g_form.getValue('u_q2_pick')) g_form.setValue('u_q2_pick', false);
// if (g_form.getValue('u_q4_pick')) g_form.setValue('u_q4_pick', false);
// if (g_form.getValue('u_q5_pick')) g_form.setValue('u_q5_pick', false);

// The 2nd would be:
// if (g_form.getValue('u_q1_pick')) g_form.setValue('u_q1_pick', false);
// if (g_form.getValue('u_q3_pick')) g_form.setValue('u_q3_pick', false);
// if (g_form.getValue('u_q4_pick')) g_form.setValue('u_q4_pick', false);
// if (g_form.getValue('u_q5_pick')) g_form.setValue('u_q5_pick', false);

// The 1st would be:
// if (g_form.getValue('u_q2_pick')) g_form.setValue('u_q2_pick', false);
// if (g_form.getValue('u_q3_pick')) g_form.setValue('u_q3_pick', false);
// if (g_form.getValue('u_q4_pick')) g_form.setValue('u_q4_pick', false);
// if (g_form.getValue('u_q5_pick')) g_form.setValue('u_q5_pick', false);

//Reset the 'in_process' flag
g_scratchpad.clearCheckboxes_InProcess = '';
}
}

[michaeltaylor]

I was able to simplify the CS OnChange example, toggling the Checkboxes to behave like radio buttons.

The scratch variable and recursion checking/logic can be avoided.

The getValue calls return the true/false as string values, so needs to be checked as text strings and not be relied on as returning an actual true/false.

I also use the newValue passed in, so do not need to call getValue.

// OnChange of u_q1_pick

function onChange(control, oldValue, newValue, isLoading, isTemplate) {

    if (isLoading || newValue === '') {

          return;

    }

    //Type appropriate comment here, and begin script below

    if (newValue == 'true') {

      g_form.setValue('u_q2_pick',false);

    }

}

// OnChange of u_q2_pick

function onChange(control, oldValue, newValue, isLoading, isTemplate) {

    if (isLoading || newValue === '') {

          return;

    }

    //Type appropriate comment here, and begin script below

    if (newValue == 'true') {

      g_form.setValue('u_q1_pick',false);

    }

}

[Uday4]

Hi, 

i guess its pretty late to write here but still as a reference for the newbies.

Radio button options are provided to as customisation in System properties UI properties [system_properties_ui].

1) Navigate to System Properties > UI properties

2) Check for "Maximum allowed choices displayed as radio buttons (exceeding this number will convert the list to a traditional choice-list)"

3) Enter the maximum number , after which a choice list will be shown on UI.

--

Now while creating form create a field with type choice and if the number of choices provided entered is less than the max value provided, UI will show radio button or it will show the regular choice list.

Hope this helps.

[sacha2]

Hi,

After doing what you said, I still don't have "Choice" in the "Type" list in a variable definition.

Any idea ?

[niveditakumari]

Hello Udy, 

Thank you for this new approach. 

I have to create two radio button and i am not able to find radio button field type in Form Personalization. What should i do here.

Can you please suggest. 

Regards, 

Nivedita