Model Apps - Controlling the UI with JavaScript

Problem:  I have a form of view in a Model Driven App (Power Apps) that needs to show 1 of 2 tabs depending on a control in the form having a value.

js> If the "Status"="Active show the "Agent" tab else show the "General" tab

Hypothesis: inject JS into the specific form that will check the status display control, and if active, get the Agent tab via the DOM, and hide it.

Solution:

1. Ensure you have two tabs on your form, my form is called "Information", see below

2. Create a JavaScript file to manipulate the DOM, my example is below:

Create a .js file to upload

Reference Blog for most common JS CRM work

3. Upload the file and publish.

4. Bind the JS function on the form or page being adjusted.

5. Result when the Status is active to hide the "Agents" tab.