Skip to main content

I have a form with one global panel and 5 section panels. I use javascript hide / show method or css() to hide and display the panles. But there always be huge blank space. There is no control overlapping. Contols are set to auto resize. But the problem is persistent. 

I am wondering if I can use javascript to move the displayed panel up to the top.

Hi @lcha 

 

if possible could you please provide some screenshots or a form export as example?

 

Jake 


Is there any particular reason you couldn’t use a Formatting Rule to hide the panels? If you do, it should automatically resize the form whenever they are hidden / shown.


Hi @lcha 

 

if possible could you please provide some screenshots or a form export as example?

 

Jake 

Hi Jake

There are 5 buttons corresponding to 5 panels. When user clicks a button, it will hide other 4 sections and only displays the relevant section.  However, the hidden panels still take spaces. currently I can make it work by manually moving the panel up in javascript.

 

function changeScheduleOnClick(){               
NWF$('.panelDescription').hide();
NWF$('.panelCategory').hide();
NWF$('.panelPlan').hide();
NWF$('.panelAssessment').hide();
NWF$('.panelSchedule').show();
NWF$('.panelSchedule').css("top","50px");
}

 

 

 


Is there any particular reason you couldn’t use a Formatting Rule to hide the panels? If you do, it should automatically resize the form whenever they are hidden / shown.

Thanks. I can try that.

 

Sean


Hi @lcha 

Have you solved your question?


Reply