Documentation AEM AEM Tutorials AEM Forms Tutorials

Deploy the sample

Last update: Tue May 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Topics:
Adaptive Forms

CREATED FOR:

Intermediate
Developer

To get this use case working on your system, please follow the following instructions:

NOTE

It is assumed that you are running AEM Forms on port 4502.

Create database

This sample uses MySQL database to store the adaptive form data. You will need to create the database schema by importing the schema file into MySQL workbench.

Create datasource

You need to create a Apache Sling Connection Pooled DataSource called StoreAndRetrieveAfData pointing to the database schema created in the earlier step. The code in the OSGi bundle uses this datasource name.

Create Form Data Model

Form Data Model needs to be created based on this datasource called StoreAndRetrieveAfData. This form data model is used to fetch the mobile phone number associated with the application id. The form data model can be downloaded from here.

Create developer account with nexmo

Create a developer account with Nexmo for sending and verifying OTP codes. Make a note of the API Key and API Secret Key. The data source and form data model have already been created for you against this service and are included with the assets mentioned in the previous step.

Deploy the following OSGi bundles

Deploy the bundle which has the code to store and fetch data from database
Download and unzip the developingwithserviceuser.zip.
Deploy the DevelopingWithServiceUser.jar file using the Felix web console.

Deploy the client library

The sample uses 2 client libraries. Import these client libraries into AEM.

Import the custom adaptive form template

The sample forms used in this demo are based on a custom template. Import the custom template into AEM

Import the sample adaptive forms

The 2 forms that make up this sample need to be imported into AEM. The sample forms can be downloaded from here

Open the MyAccountForm in edit mode. Specify the Vonage API Key and API Secret values in the appropriate fields in the adaptive form.

Test the solution

Preview the StoreAFWithAttachments
Enter your mobile number including the country code ,fill in your user details and add some attachments. Click the “Save And Exit” button to save the adaptive form and its attachments

Demonstration of the use case

https://video.tv.adobe.com/v/327122?quality=12&learn=on

Transcript

Hi, in this video, we will take a look at the use case of saving and retrieving an adaptive form with attachments using two-factor authentication. So, what you see on the screen is a fairly basic adaptive form which allows me to enter my mobile number and some of my contact details here.

And it also allows me to add some attachments. So, for example, I’m going to add my California driver’s license attachment here, and I’m also able to add bank statement here. So, I can add a bank statement for the month of September. Now, if I want to save and exit and come back to continue filling the form at a later stage, I can click on this button. The form gets stored in the database and I’m presented with a unique identification number that can be used to retrieve this application at a later time. So, I click on this Okay and I’m presented a screen which allows me to fetch my application. So here I’m going to enter the unique ID and fetch my application. I have, then I need to confirm my telephone number for two-factor authentication. So here I will click on confirm telephone number. So now I need to confirm my telephone number with the OTP code that was sent to me. And that code is 0331. And when I confirm the OTP code, my partially completed application will be presented to me. So, this is my application which has the data that was filled in earlier. And it also has the attachments. So, in this course, we will take a look at behind the scenes steps that were needed to accomplish this particular use case. -

recommendation-more-help

8de24117-1378-413c-a581-01e660b7163e