How do I hide/show a tab within a form section based on another field?

Kevin Recio1
Mega Contributor

On our change form, we are adding a tab specifically for application type change requests (as opposed to our infrastructure changes). We would like to have this tab be hidden unless someone chooses "Application" in the 'Class' field:

find_real_file.png

I tried using the instructions from this blog post, but the Application tab is still showing no matter what is chosen in the Class field. Below is the script I have:

find_real_file.png

Pasted as text:

[To show the tab when "Application" is chosen]

function onCondition() {

g_form.setSectionDisplay('application', false);

//Show the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.show();
//Show the tab
$$('.tab_caption_text').each(function(caption) {
if(caption.innerHTML == 'Application'){
caption.up('.tab_header').show();
}
});}

 

[To hide the tab when "Application" is not chosen]

function onCondition() {

g_form.setSectionDisplay('application', false);

//Hide the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.hide();
//Hide the tab
$$('.tab_caption_text').each(function(caption) {
if(caption.innerHTML == 'Application'){
caption.up('.tab_header').hide();
}
});

}

1 ACCEPTED SOLUTION

Lets start with minimum code in both true and false code blocks

Make sure  active=true, reverse if false = true

 

for the true code block use

 

 

function onCondition() {

g_form.setSectionDisplay('application', false);
/*
//Show the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.show();
//Show the tab
$$('.tab_caption_text').each(function(caption) {
if (caption.innerHTML == 'Application') {
caption.up('.tab_header').show();
}
});
*/
}

 

for false code block use

function onCondition() {

g_form.setSectionDisplay('application', true);

/*
//Hide the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.hide();
//Hide the tab
$$('.tab_caption_text').each(function(caption) {
if (caption.innerHTML == 'Application') {
caption.up('.tab_header').hide();
}
});
*/
}

 

 

 

View solution in original post

18 REPLIES 18

As @Prateek kumar suggested make sure isolate script is off on the UI policy

 

 

find_real_file.png

I was able to uncheck the "Isolate Script" setting for my UI policy, and now I am getting a slightly different error message:

find_real_file.png

Lets start with minimum code in both true and false code blocks

Make sure  active=true, reverse if false = true

 

for the true code block use

 

 

function onCondition() {

g_form.setSectionDisplay('application', false);
/*
//Show the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.show();
//Show the tab
$$('.tab_caption_text').each(function(caption) {
if (caption.innerHTML == 'Application') {
caption.up('.tab_header').show();
}
});
*/
}

 

for false code block use

function onCondition() {

g_form.setSectionDisplay('application', true);

/*
//Hide the section
var section = $$('span[tab_caption_raw="Application"]')[0].select('span[id*=section.]')[0];
section.hide();
//Hide the tab
$$('.tab_caption_text').each(function(caption) {
if (caption.innerHTML == 'Application') {
caption.up('.tab_header').hide();
}
});
*/
}

 

 

 

Thank you @vkachineni ! Using your code worked - I noticed the difference was that your code contained '/*' and '*/', but otherwise the one I used seemed similar. Thank you for your help with this, much appreciated!

Kevin, The lines between /*......*/ are commented out. They are not needed to show/hide the sections.

Thanks