- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-02-2024 12:53 AM
I have Dropdown Variable with 3 choices including None :
1. Approvals
2. Governance
3. Ticket Merics
Now, I have 3 sections with names are approvals, governance, and ticket metrics. When the form loads all those sections will be hide, based on choice selection those section would be only display.
Anyone know how to achieve this...
Solved! Go to Solution.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-02-2024 01:01 AM
Hi @Sanghavi-1 ,
You can write a onChange client script to achieve this functionality on the variable which is having 3 choices. with this script the sections will display based on selection of that choice variable.
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
var sn = g_form.getSectionNames(); // returns all existing sections
if (isLoading || newValue === '') {
// To Hide all the sections by default.
sn.forEach(function(sec) {
g_form.setSectionDisplay(sec, false);
});
return;
}
var i=sn.indexOf(newValue);
if (newValue != ''){
// section will display upon selection of newvalue.
for(var c=0;c<=sn.length;c++){
if (sn[c] == sn[i]){
g_form.setSectionDisplay(sn[c], true);
}
else{
g_form.setSectionDisplay(sn[c], false);
}
}
}
}
If my solution got any helpful to you then make my answer as Correct Answer and give a like for my solution.
Thanks,
Aditya
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-02-2024 01:01 AM
Hi @Sanghavi-1 ,
You can write a onChange client script to achieve this functionality on the variable which is having 3 choices. with this script the sections will display based on selection of that choice variable.
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
var sn = g_form.getSectionNames(); // returns all existing sections
if (isLoading || newValue === '') {
// To Hide all the sections by default.
sn.forEach(function(sec) {
g_form.setSectionDisplay(sec, false);
});
return;
}
var i=sn.indexOf(newValue);
if (newValue != ''){
// section will display upon selection of newvalue.
for(var c=0;c<=sn.length;c++){
if (sn[c] == sn[i]){
g_form.setSectionDisplay(sn[c], true);
}
else{
g_form.setSectionDisplay(sn[c], false);
}
}
}
}
If my solution got any helpful to you then make my answer as Correct Answer and give a like for my solution.
Thanks,
Aditya
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-02-2024 01:04 AM

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
07-02-2024 01:09 AM
@Sanghavi-1 You need to create an onChange client script on the Dropdown variable and then you can use the onChange script as follows.
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}
if (newValue == 'Approvals') {
//Type appropriate comment here, and begin script below
g_form.setSectionDisplay("<section name>", false);
} else if ((newValue == 'Governance')) {
g_form.setSectionDisplay("<section name>", false);
} else if ((newValue == 'Ticket Merics')) {
g_form.setSectionDisplay("<section name>", false);
}
}
Replace section name with the name of section.