Hide a Business Process Flow Using JavaScript

Hide a Business Process Flow Using JavaScript

In some scenarios, you may want to hide a Business Process Flow (BPF) once the entire process is complete. In this post, we’ll walk through how to achieve this in a model-driven app using JavaScript.

Once the last stage is completed, the JS code hides the control.
Table of Contents hide
1. The Methodology
2. Applying the Code
3. Test and Validate

The Methodology

We can use the formContext.data.process client API to determine the status of the BPF with the getStatus method. When the process is complete, this method returns the string value “finished”. Then, call the formContext.ui.process.setVisible method to hide or show it.

Applying the Code

Create a new web resource and copy/paste the code below:

function setBFPVisiblity (executionContext){
    
const formContext = executionContext.getFormContext();
const bfpId = formContext.data.process.getInstanceId();

    if (!bfpId) {
        console.log("No BPF instance found.");
        return;
    }

const bfpStatus = formContext.data.process.getStatus();
const isVisible = bfpStatus !== 'finished';

// Hides the BFP based on bfp Status boolean result

formContext.ui.process.setVisible(isVisible);
console.log("BFP Status is " + bfpStatus + ". " + "BFP Visible " + isVisible);

}

Next, we’ll need to go into our main form and add the web resource. It makes the most sense in this example to add it as an on load event. This way, each time the form loads, it shows or hides the BPF. Be sure to use the exact function name from your JavaScript code. Don’t forget to toggle “Pass execution context as first parameter”. Save and Publish the form.

Adding a new web resource

Test and Validate

Play your model driven app and navigate to the main form. Use F12 to open developer tools, and do a hard refresh (Ctrl + Shift + R). For example, I’ve already finished the BPF for this record, so it’s now hidden. The console log message affirms this.

Business Process Flow is now hidden

Even if hiding the BPF when the last step is finished isn’t your exact scenario, you can easily adapt this approach to fit your needs. For example, you could base the visibility on a status value in your table that’s linked to the BPF—fetching that value and checking its condition before showing or hiding it. The flexibility is there, so you can tailor it to your needs.

Tags: , ,