Showing Process Instance (List Record) Data in a Form

Introduction

This guide outlines how to display data from a process instance within a form in Joget. By creating a form and linking it to a list through a hyperlink, you can easily allow users to view detailed information about a specific process instance directly from the UI. This approach streamlines data access and enhances user interaction with your Joget application.

Following these steps will ensure that users can seamlessly navigate from a list view to a detailed form view, providing them with a more interactive and informative experience.

How does it work?

To display data from a process instance (e.g., list record) within a form in Joget, you first need to create a Form to present the data. You must also create a List that will be visible in your UI and add the List element in the UI. This process involves configuring the form element and setting up a hyperlink in the List that directs users to view the detailed data in the form.

1. Begin by creating a Form where you want to display the process instance data. Ensure the Menu ID property is set, as it will be used in the hyperlink to access the data from within the form.
   
2. Next, add a Hyperlink action in the List Builder design. This action will create a clickable link in the list that users can select to view detailed information in the form.
   
   
3. In the Configure Hyperlink action, set the Hyperlink property to point to the form's path, using the Menu ID property from the form. Specify Hyperlink Parameter Name and Column Name as id.
   
   
4. The configuration will generate a URL path such as
   

   http://localhost:8080/jw/web/UI/leaveApp/UI//applicationForm?id=21162_leaveApp_applyLeaveProcess

   where the format is used
   

   hyperlink/hyperlinkParameterName/columnNameValue

   
5. Once the app is published, clicking the Open hyperlink in the List will open the process instance data in the form created.