Create and configure adaptive form

Transcript

Hi. In this video, we will create an adaptive form with non-disclosure agreement verbiage in it. We will then configure the adaptive form to autogenerate a document of record. We will also configure the form to trigger an AEM workflow on submission. The AEM workflow will then utilize the autogenerated document of record and send that document of record for signatures using Adobe Sign. So the first thing we need to do is log into AEM Forms and create your adaptive form.

So every adaptive form will be based on a template. When you install AEM Forms, you get these three templates out of the box. For our demo purposes, I’m going to select Blank template and click on Next. Here you can provide a meaningful name and a title for your form. And in the Form Model tab, make sure you select the Generate Document of Record. So what that does is it generates a PDF of the data that was in the adaptive form. So whatever data the user enters into the adaptive form or whatever text content that your adaptive form has. That will be transferred onto a PDF and that PDF can then be used for archival purposes or can be used to send for signatures, using an AEM workflow. So then click on Create.

So once the form is created, let’s open it in the Edit mode.

So as you can see, every form has a Form Container and a Root Panel. So we need to start adding some components to this Root Panel, like a text component, text box and some standard non-disclosure agreement verbiage into this Root Panel. And also, the other important thing that we have here is the Document of Record options. That is coming because our adaptive form was configured to generate a Document of Record.

So we have authored our non-disclosure agreement by adding some components to the form. So as you can see under the Root Panel, I’ve added an Adaptive Form Title component. And under the Root Panel, I’ve added two child panels. Recipient Details and Scope Of Agreement. And under these child panels, I have some components here. For instance, the recipient name and recipient email under the Recipient Details child panel. And under the Scope Of Agreement child panel, I have some static text here. It’s quite easy to add components to the panel. For example, if you want to add a component under your Root Panel, you can select the panel here and click on the plus icon here to add any of the components that AEM Forms provides. Or if you want to add a child panel to your Root Panel, you simply select this and click on this option to add the child panel. So now that our form is complete, let’s take a look at configuring or customizing the Document of Record. So as you remembered, we have configured this form to automatically generate a Document of Record and because of that, we see this option on the left-hand side. So let’s click on that.

And notice the various options that you have. The first thing is the template. So by default, most of the times, you’ll be using a default template that AEM Forms provide for you to generate the Document of Record. So in this template, we will merge the data or any static text that you may have in your adaptive form with this particular template. You can also customize certain aspects of the Document of Record. For example, you can change the logo by uploading your own image or browsing to an image within your repository. You can customize the form title, the header text, the disclaimer label and the disclaimer text. You can also customize the accent color and some additional options are available here. Please refer to online documentation on various customization options that are available for you in the Document of Record. So once you’re satisfied with these options, you can also generate a preview of the Document of Record to see how it’s going to look like at runtime. So as you can see, there’s a logo here on the left-hand side. There’s a form title, the actual content of your adaptive form is here and then at the bottom, you’ll find the disclaimer section and then the disclaimer text here.

There are other options that you can specify, for example, when you go back to your adaptive form here, go to the content hierarchy and open up any of those components that make up your form. For example, let’s take a look at the Recipient Name configuration options here. So you can exclude certain fields from the Document of Record. For example, I have this recipient name here. If you don’t want this data to be included in the Document of Record, you can select this and exclude it from the Document of Record. Or you can exclude the entire panel from the Document of Record. For example, the Recipient Details section here. I have excluded the entire panel to be included in the Document of Record here. So exclude everything from Document of Record. What that does is it excludes the panel and all the components that are included in that panel from your Document of Record. So once you’re satisfied with your Document of Record, the next thing to do is to configure the submission options of our adaptive form. So let’s go to the Form Container here. Open up its configuration properties.

And go to the Submission options. So here we have configured the form to use a thank you page. So whenever a form is submitted, a thank you message will be shown by showing this particular form. And then we have configured the submit action to invoke and AEM workflow. And this is the name of the workflow.

There are three things that you need to remember here. The first is the data file path. That is the file that will hold the submitted data. So we can give it any name you want. In my case, I’m going to call it Data.xml. Since our form is not going to contain any attachments, I’m going to leave it blank. And then this is the name of the Document of Record that will be generated by AEM Forms. So again, this name can be any name. I have called it NDAAgreement.PDF. So once you’re satisfied with these options, save your settings. And then the next thing we need to do is to add a Submit button to our form. So let’s go to the Root Panel here, click on Insert. And add a Submit button.

So I’ve changed the Submit button’s title to Submit For Signature. And to recap, our form is configured to trigger an AEM workflow and the name of the workflow model is send-nda-for-signatures. The data file path is set to Data.xml, which means the submitted data from the adaptive form will be stored in a file called Data.xml. And the Document of Record path will be set to NDAAgreement.PDF. That means the automatically generated Document of Record will be stored in a file called NDAAgreement.PDF. The attachment path is left blank because our form is not going to contain any attachments. So these names need to match the names that were provided in your AEM workflow. So for example, if you were to go back to the workflow, and open up the Set Variable component here, here we are initializing a variable of call submittedData, which is of type XML and we are saying select a file, which is placed relative to the payload and the name of the file is Data.xml. So this file is the same file name that you were provided in your adaptive form configuration. The same thing for Sign Document component here. In the Sign Document, we have said use a file relative to payload and the name of the file is going to be NDAAgreement.PDF. Again, this file needs to be the same file name that you have provided in configuring your adaptive form. The next thing I wanted to talk was every time you submit an adaptive form to trigger an AEM workflow, it creates some nodes in your CRX Repository. So let’s take a look at those notes. To do that, I’ve logged into my CRX Repository.

You open up your var folder and under the var folder, there is an instances folder. Under that, you’ll open up your server0 folder. So there you will see a number of folders, each folder representing a date. So go to the latest folder in that, meaning that folder which corresponds to the date on which you triggered your workflow. In my case, it’s going to be August 11th and on that day, I have triggered so many workflows. For example, send-nda-for-signature’s workflow was triggered four times. So you can expand any of those workflow nodes. Under the data folder and select the metadata. So the metadata folder has some properties and these properties represent a variable in your workflow. For example, signature status is available that we defined in our workflow, signersEmail and submittedData. If you were to select the payload folder and in that payload folder, there’s a property called path. So copy that path and if you were to go to that particular path here, so that’s the path here. And under that payload path, you will see two files. One so the Data.xml. This is the XML file which holds the submitted data and the NDAAgreement.PDF. This is the automatically generated Document of Record, which will be used by our workflow. So if you open the Data.xml, you will see the submitted data in an XML format. Since our form was not based on a schema, the entire data is stored under the AF UnboundData. -