Not applicable

Hide all panels during form load

Hello Friends,

I have a choice column with 3 selections, S1, S2 and S3. Based on the selections, I'm using the Panels to display only the relevant data. So these are my requirements:

1. If I select S1, the Panel 1 and Panel 2 should be hidden

2. If S2 is selected, Panel 3 should be hidden

3. If S3 is selected, all the Panels should be displayed

4. If none of the options are selected, which is ideally during form load, all the Panels should be hidden,

Can you please assist on how to achieve this functionality?

Thank you.

0 Kudos
Reply
5 Replies
mlauer
Nintex Newbie

Re: Hide all panels during form load

You can use formatting rules to hide controls.

Reply
Not applicable

Re: Hide all panels during form load

Hi Manfred,

Yes it does help solve the issue. If I exclude the point 4 from my initial request, then applying formatting rules are working as expected. However, if I include the point 4, all the formatting goes haywire. So I guess I need some help on implementing all the rules together

Reply
janeyres
Nintex Newbie

Re: Hide all panels during form load

Hi,

You could have a default value for the choice field of something like "Please select a value" then you could have formatting rules that hide all panels if this is the selected choice.

Jan

0 Kudos
Reply
Not applicable

Re: Hide all panels during form load

Hi Jan,

Thank you for the suggestions. This is a radio button based choice column, so "Please select a value" cannot be used

Reply
janeyres
Nintex Newbie

Re: Hide all panels during form load

Hi,

I've got a solution that just involves script, you can remove any formatting rules.

If you apply an individual class to each of the panels, e.g. panelS1, panelS2 and panelS3 and assign the Choice control ID to a JavaScript variable called myChoices.

Then paste the following script in the Custom JavaScript section in Form settings:

NWF.FormFiller.Events.RegisterAfterReady(function(){

NWF$(".panelS1").hide();

NWF$(".panelS2").hide();

NWF$(".panelS3").hide();

NWF$("#"+myChoices).change(function()

{

var selectedChoice = NWF$("#"+myChoices + " input:checked").val();

switch (selectedChoice)

{

case "S1":

NWF$(".panelS1").hide();

NWF$(".panelS2").hide();

NWF$(".panelS3").show();

break;

case "S2":

NWF$(".panelS1").show();

NWF$(".panelS2").show();

NWF$(".panelS3").hide();

break;

case "S3":

NWF$(".panelS1").show();

NWF$(".panelS2").show();

NWF$(".panelS3").show();

break;

}

});

});

Jan

Reply