In today's tutorial, we'll explore seamlessly integrating published forms into your application using the FlowForms plug-in. This powerful tool simplifies the process of displaying and managing forms within your app, providing a smooth user experience. Follow along as we walk through the steps, from importing the sample app to creating and viewing published forms within your application.

If you prefer to view this tutorial as a video, you can watch it here.

Step 1: Importing the Sample Application

First, let's import the sample application, which includes the components for integrating FlowForms. This sample app is a foundation for our tutorial and provides a convenient starting point.

a. Import the sample application.

b. Install the sample application.

Step 2: Installing the Sample Application and Supporting Objects

Once the sample app is imported, you can go ahead and install the supporting objects within your development environment. This installation will ensure that all required dependencies are set up correctly for our demonstration.

a. Verify the supporting objects

b. Check if ORDS is REST Enabled

c. Install Supporting objects

Step 3: Publishing a Sample Form

Before we can view forms in our application, let's publish a sample form from the imported sample app. Once we've published successfully, we'll go ahead and proceed to the next step.

a. Select a sample form

b. Publish the form

Step 4: Creating the Application

Now, let's create an application to integrate the FlowForms plug-in. We'll disable the authentication scheme for simplicity and import the necessary plug-ins from the sample app, focusing specifically on the FlowForms plug-in.

a. Create an application

b. Disable the auth schema (optional) under “Shared Components” > “Authentication Scheme”.c. Import the FlowForms Plug-in.

Step 5: Setting up Regions and Page Items

We'll set up the plug-in region and page items within our newly created application to hold the form ID. We'll create a region named "UC Flow Forms" and define a page item ID, ensuring the default value corresponds to the form ID we published earlier. Also, set the Form ID in the “page Items to submit” on the Region. It will not work as expected if you don’t do this.

a. Create the Flow Forms Region using our Region Plug-in.

b. Add a page item ID with the static value of the published form

In the attributes of the FlowForms region, make sure that you also set the Form ID Attribute (using the page item you just created) and enable the “Published Form” flag since we are looking at published data.

c. Set the Attributes of the region.

Congratulations! You've successfully learned how to view published forms within your application using the FlowForms plug-in. This tutorial has demonstrated the ease and efficiency of integrating forms into your app, enhancing user engagement and workflow efficiency. Experiment with different forms and configurations to tailor the experience to your requirements.