Copy link to clipboard
Copied
I am building a form and I would like a group of radio buttons to be available for selection based on whether the leading checkbox is selected.
If Checkbox 1 is selected, then the user could chose one of three following Radio Buttons.
If Checkbox 2 is selected, then the user could chose one of three (different from the first Group) Radio Buttons.
If Checkbox 3 is selected, then the user could chose one of two (different from the first and second Group) of Radio Buttons
The Radio buttons should only be able to be selected if the preceeding checkbox is selected.
I am very new to Java Scripts and need HELP!
Copy link to clipboard
Copied
You can hide the radio buttons you don't want to be selectable by accessing their widget.
Let's say you have 3 radio buttons and name of the group is "Group1", first button would have widget number 0, and you would access it like this ("Group1.0"), second is 1 and 3rd is 2, so let's say you want to hide first two buttons if checkbox is checked, as 'Mouse UP' action of checkbox add this script:
if(event.target.value !== "Off"){
this.getField("Group1.0").display = display.hidden;
this.getField("Group1.1").display = display.hidden;}
Copy link to clipboard
Copied
Excellent!
How would I reset (unhide) the radio buttons if the user changes their mind - changes their selection of Checkbox?
Copy link to clipboard
Copied
I would suggest you to use custom calculation script in any text field so it can automatically change state of the radio buttons. If you tell me exact names of the checkboxes and radio buttons and all the conditions to show/hide radio buttons, I can help you make that script.
Copy link to clipboard
Copied
This is so incredibly kind of you!
Check Box1 (Export Value 1)
Radio Buttons: Group 5.0, Group 5.1, Group 5.2
Check Box1 (Export Value 2)
Radio Buttons: Group 6.0, Group 6.1, Group 6.2
Check Box1 (Export Value 3)
Radio Buttons: Group 7.0, Group 7.1
Check Box1 (Export Value 4)
Text Box 8
If Check Box1 (Export Value 1) is checked, Any one of Radio Buttons - Group 5.0, Group 5.1, Group 5.2 - can be selected, but not Radio Buttons - Group 6.0, Group 6.1, Group 6.2 OR Group 7.0, Group 7.1.
If Check Box1 (Export Value 2) is checked, Any one of Radio Buttons - Group 6.0, Group 6.1, Group 6.2 - can be selected, but not Radio Buttons - Group 5.0, Group 5.1, Group 5.2 OR Group 7.0, Group 7.1.
If Check Box1 (Export Value 3) is checked, Any one of Radio Buttons - Group 7.0, Group 7.1 - can be selected, but not Radio Buttons - Group 5.0, Group 5.1, Group 5.2 OR Group 6.0, Group 6.1, Group 6.2.
If Check Box1 (Export Value 4) is checked, Text8 becomes available to the user.
If the user changes their mind, after initally selecting a Checkbox and would like to select a different Checkbox it would be great for the form to reset - allowing all radio buttons to show until the new Checkbox is selected.
Copy link to clipboard
Copied
What should happen to radio buttons when export value 4 is selected, should they all become unavailable?
Copy link to clipboard
Copied
Yes, only Text8 should be available.
Copy link to clipboard
Copied
Use this as custom calculation script of "Text8" field:
var g5 = this.getField("Group 5");
var g6 = this.getField("Group 6");
var g7 = this.getField("Group 7");
var check = this.getField("Check Box1").valueAsString;
if(check === "1"){
g5.readonly = false;
g6.readonly = true;
g7.readonly = true;
this.resetForm(["Group 6", "Group 7"]);
event.target.readonly = true;
event.value = "";}
else if(check === "2"){
g5.readonly = true;
g6.readonly = false;
g7.readonly = true;
this.resetForm(["Group 5", "Group 7"]);
event.target.readonly = true;
event.value = "";}
else if(check === "3"){
g5.readonly = true;
g6.readonly = true;
g7.readonly = false;
this.resetForm(["Group 5", "Group 6"]);
event.target.readonly = true;
event.value = "";}
else if(check === "4"){
g5.readonly = true;
g6.readonly = true;
g7.readonly = true;
this.resetForm(["Group 5", "Group 6", "Group 7"]);
event.target.readonly = false;}
else{
g5.readonly = true;
g6.readonly = true;
g7.readonly = true;
this.resetForm(["Group 5", "Group 6", "Group 7"]);
event.target.readonly = true;
event.value = "";}
This will set fields to readonly it won't hide them, if you wish to hide them use display property instead of readonly.
Copy link to clipboard
Copied
Absolutely AMAZING!
You are a genius. I have been struggling with this for over a week. I can't thank you enough.