Hands on 7 - using Flow to save the data from Visualforce page

In Hands on 2 - open a Flow for unauthenticated access section, we discussed a way to open a Flow access for unauthenticated access by embedding it to a Visualforce page. There is another possibility of using the Flow as the backend class to save the data from the Visualforce page. Let's start with a business scenario.

Robby Williams, who is working as a system administrator with Universal Containers, receives a requirement to create an event registration form to save the data in a custom object. For the frontend, they want to use Visualforce page and for the backend, they want to use Flow to save the data.

There are many possible solutions for the preceding business scenario. We will use the Visualforce page as the user interface screen (frontend) to allow users to enter the data and Flow to save the data in a custom object. To achieve this, perform the following steps:

  1. First of all, create a custom object Event Registration, set record name as Auto Number data Type. Also, create few fields Title, First Name, Last Name, Email Address, and Company. Make a schedule for the required field and grant permissions to respective profiles. For more details, refer to the following screenshot:

Later on, we will use this object to save the event data from the Visualforce page. 

  1. The next step is to create a Flow. Navigate to Setup | Build | Create | Workflow & Approvals | Flows and click on the New Flow button, and it will open the Flow canvas for you. Create some variables in the Flow, as shown in the following table:
Name Data Type Input/Output Type
VarT_Company Text Input and output
VarT_EmailAddress Text Input and output
VarT_FirstName Text Input and output
VarT_LastName Text Input and output
VarT_Title Text Input and output

We will use these variables in the Flow.

  1. Now we will add a Record Create element to the Flow to create the data in the custom object Event Registration. Click on the Palette tab and drag and drop the Record Create element onto the canvas. It will open a new window for you, where you have to enter the following details:
    • Name: Enter the name for the Record Create element. In this case, enter Create event registration as Name.
    • Unique Name: This will be autopopulated based on the name.
    • Description: Write some meaningful text so that another developer/administrator can easily understand why this Record Create element was created. When you select the Record Create element in the Explorer tab, the description appears in the Description pane.
    • Create: Select the object for which you want to create the record. In this case, select the Event_Registration__c object. The next task is to assign the value or resource to the object fields, and data types must match. To assign values to multiple fields, click on the Add Row link.
    • Variable: Optionally, you can save the new record's ID in a variable so that you can use it later in the flow.

It will look like what is shown in the following screenshot:

  1. Once you are done, click on the OK button.
  2. Set the Record Create element Create event registration as the Start element.
  3. Save the Flow with the name Event Registration Form and close the Flow designer using the Close button. It will redirect you to the Flow detail page. Don't forget to activate the Flow.
  1. From the Flow detail page, copy Unique Name; it will look like this: Event_Registration_Form.
  2. The next task is to create a Visualforce page to allow users to enter the data. Navigate to Setup | Build | Develop | Pages and click on New to add a new Visualforce page. Create a Visualforce page with the name EventRegistrationForm. To add the input field to the Visualforce page, use the following code:
        <apex:inputText id="Title" Value="{!Title}"  required="true"/>

Likewise, use the same code to get user input for other fields.

  1. Add a button to the Visualforce page that allows users to submit the event registration form. Use the following code to add the command button onto the Visualforce page:
        <apex:commandButton action="{!Save}" value="Save"  
reRender="myFlow"/>
  1. To embed the Flow into a Visualforce page and then pass the value from the custom controller to the Flow variables, use the following code:
        <flow:interview name="Event_Registartion_Form" id="myFlow" 
rendered="{!renderOrNot}">
<apex:param name="VarT_Title" value="{!inputTitle}"/>
<apex:param name="VarT_FirstName" value="{!inputFirstName}"/>
<apex:param name="VarT_LastName" value="{!inputLastName}"/>
<apex:param name="VarT_EmailAddress" value="
{!inputEmailAddress}"/>
<apex:param name="VarT_Company" value="{!inputCompany}"/>
</flow:interview>

Finally, the Visualforce page will look like what is shown in the following screenshot:

  1. The next step is to add a custom controller to the Visualforce page in order to pass the input data to the Flow variables. Navigate to Setup | Build | Develop | Apex Classes and click on New to add a new Apex class. Create an Apex class with the name EventRegistrationFormController. Use the following code to pass the user input from the Visualforce page to Flow variables using the custom controller:
        Public void Submit() 
{
renderOrNot = true;
inputTitle = Title;
inputFirstName = FirstName;
inputLastName = LastName;
inputEmailAddress = EmailAddress;
inputCompany = Company;
}
You can download the example code files from your account at http://www.packtpub.com for all the Packt Publishing books you have purchased. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.
  1. Once you are done with the Visualforce page and custom controller, you can also expose this page for unauthenticated access using Force.com site, as mentioned in the Hands on 2 - open a Flow for unauthenticated access section.
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.142.197.212