Form Configuration
Adaptive Form Page
The adaptive form page is the actual form. By using the soiSharePoint Form Template the new form will automatically contain two primary components: the Form Container and the Root Panel. Both components are required, and need to be configured for the form to function correctly.
Adaptive Form Container
The adaptive form container, also known as the guideContainer, is the start of the form UI, and several properties that effect the entire form will be configured here. A global toolbar can also be added from the edit bar for this component. Action buttons, such as save, reset, and submit can then be added to the toolbar to perform actions on the entire form.
Basic Properties
Basic Configuration Information
- Client Library Category: soi.form-analytics,cq.jquery.ui
- Adaptive Form Theme: SOI Forms Theme
- CSS File: /content/dam/soi/en/web/[your agency]/resources/css/[agency]-form.css
- The file path provided above contains a basic CSS file that can be used for SOI Forms
- Mobile Navigation: Layout without panel tiles in the form header
- Unless panels are being used within the form
Submission Properties
Submission Configuration Information
- Use asynchronous submission: [leave unchecked]
- Redirect URL/Path: [leave blank]
- Store data in forms portal: [leave unchecked]
- Revalidate on server: [leave unchecked]
- Submit Action: select one of the following: Send Email, SOI Forms - Submit to Sharepoint List, or Send PDF via email
- Depending on the Submit Action selected various Action Configuration fields will be presented
Options for Submit Action
- Send Email
- SOI Forms - Submit to Sharepoint List
- Send PDF via email
- Action Configuration
- From* (required): AEMPortal@illinois.gov
- To: [if an email address is not entered AEM will throw an error when someone tries to submit the form]
- CC: [add email addresses as needed]
- BCC: [add email addresses as needed]
- Subject: [Example: Contact Us Ex Form - ${subject} ]
- Email Template: [Example: The following information was submitted:
Name: ${name}
Email: ${email}
Phone: ${phone}
Subject: ${subject}
Message: ${message} ]- If creating an email template with a large body of text it is much easier to type up in a text editor. Then copy and paste into the field on AEM.
- Email Template Path: [leave blank]
- Include attachments: [check if File Attachment button is included on form; otherwise do not check]
Use the following syntax to pull information directly from the a field in the form to the email.
Name (of form field): subject
Syntax for inserting field values in email: ${subject}
- Action Configuration
- Sharepoint API Path: [base URL of SharePoint Online site containing list]/_api/web
- [base URL of SharePoint On-prem site containing list]/_api
- Sharepoint List Name: [display name of list from SharePoint site]
- Sharepoint Online or Sharepoint on-prem?* (required): select either Sharepoint Online or Sharepoint On-Prem
- Sharepoint Client ID: [ID generated on SharePoint - App Permissions] contact DoIT.WebServices@illinois.gov to obtain/create ID
- Sharepoint Client Secret: [Secret generated on SharePoint - App Permissions] contact DoIT.WebServices@illinois.gov to obtain/create Secret
- Sharepoint Tenant ID / Site Realm: [do not change default (preset) Sharepoint Tenant ID]
- Sharepoint API Path: [base URL of SharePoint Online site containing list]/_api/web
- Action Configuration
- From* (required): AEMPortal@illinois.gov
- To: [if an email address is not entered AEM will throw an error when someone tries to submit the form]
- CC: [add email addresses as needed]
- BCC: [add email addresses as needed]
- Subject: [Example: Contact Us Ex Form - ${subject} ]
- Email Template: [Example:
Greetings ${Name_1
Thank you for using our form to create an accommodation card. You will be able to print the card from the PDF attached to this email]- If creating an email template with a large body of text it is much easier to type up in a text editor. Then copy and paste into the field on AEM.
- Email Template Path: [leave blank]
- Include attachments: [check if File Attachment button is included on form; otherwise do not check]
Use the following syntax to pull information directly from the a field in the form to the email.
Name (of form field): subject
Syntax for inserting field values in email: ${subject}
Root Panel
The Root Panel of the adaptive form is where all components will be added to the form. It can also contain subpanels under the items node, and each panel (including the root panel) can have a layout associated with it.