Skip to main content

In this post, we will look at how to hide and show various elements of a Dynamics 365 model-driven Power App form, including the header and footer, using JavaScript.

First, let’s take a look at the elements of a form based on the formContext. The formContext provides us with a headerSection and a footerSection. The header is then divided into 3 parts, header command bar, header body, and header tab navigator:

Let’s hide and show each one using JavaScript.

Hide: formContext.ui.headerSection.setCommandBarVisible(false);

Show: formContext.ui.headerSection.setCommandBarVisible(true);

Hide: formContext.ui.headerSection.setBodyVisible(false);

Show: formContext.ui.headerSection.setBodyVisible(true);

Hide: formContext.ui.headerSection.setTabNavigatorVisible(false);

Show: formContext.ui.headerSection.setTabNavigatorVisible(true);

Hide: formContext.ui.footerSection.setVisible(false);

Show: formContext.ui.footerSection.setVisible(false);

Of course, you can hide all of the above. Diana has a good use case for this where she turns forms into dialogs here.

THANKS FOR READING. BEFORE YOU LEAVE, I NEED YOUR HELP.

 

I AM SPENDING MORE TIME THESE DAYS CREATING YOUTUBE VIDEOS TO HELP PEOPLE LEARN THE MICROSOFT POWER PLATFORM.

IF YOU WOULD LIKE TO SEE HOW I BUILD APPS, OR FIND SOMETHING USEFUL READING MY BLOG, I WOULD REALLY APPRECIATE YOU SUBSCRIBING TO MY YOUTUBE CHANNEL.

THANK YOU, AND LET’S KEEP LEARNING TOGETHER.

CARL

https://www.youtube.com/carldesouza

ABOUT CARL DE SOUZA

Source