Now we will use Sencha Architect to design a form in transaction and template and design custom pages which can we published as link. So there are two use where we will use Sencha Architect:
- To design form which can be used in transaction and template.
- To design custom pages which can be published as link at defined navigation path like "Pantner", "Dashboard" tab etc.(e have already a separate document for this requirement with JIRA ID: ACE-4041.)
Link for that document : /wiki/spaces/ProductSpace/pages/16254770
Design Forms Using Sencha Architect
- Install Sencha Architect on your machine.
- Open the Sencha Architect and click on plus(+) button on the top left corner.
- Design the form by using Sencha drag-and-drop feature. You can choose components from the left hand panel and drop them on the centre canvas. You can provide the configuration properties to the components like min. length, max length, allow blank, blank text, validation etc.
- Save
- Copy the folder created from step 4 and place it directly in web-apps folder of your application.
UI Design
Use Sencha Architect to design Form, use these form in Connect web form and use those web forms in Transaction/Template in Connect.
...
Backend Design
- In back-end we will create the JSON schema at the time of web form creation. We will send the JSON of selected form from GUI and create a JSON schema from this JSON. To create the the JSON schema we will write a method in WebFormRestResource.java.
- We will add a column in AC_WEBFORM table to persist the schema id which is created with web form so that we will show that schema in Template GUI. Although we can add this field in JSON Schema table but that will impact AIS so I am adding it Web Form table because it used only in Connect.
- We will write a separate REST resource is used to to execute the transaction when ever user submit the form from the transaction.
Backend Design
N/APrerequisites
Before creating a Template, you must meet the following requirements:
- Ensure that you have designed a Web Form using Snecha Architect.
- Ensure that you have created a Web Form to use for creating a Template/Transaction.
Follow these steps to create a Template using Web Form in Adeptia Connect:
- Use the existing Transaction/Template type Web Form and activate it, refer to Activating a Web Form.
- Use this Web Form to create a Template. Click Configure > Templates > CREATE Template.
- On the Create New Template screen, provide a Template name and brief description. Click Continue.
- Select File & Message from the drop-down list for the template type and click Next.
- Select Inbound from the drop-down list for direction of this template and click Next.
On the Choose Network step, select the Network for which you are creating the Template. To select multiple Networks from the drop-down list, click on the networks one by one. Click Next.
Info Only the Partners of the selected Network(s) will be able to access this Template. - On the Define Partner Parameter step, click Add Parameter to define the parameters. Click Next to select the Source Application.
- On the Choose App step, select the Web Form from the list of Source Application and click Next.
- On the On Form Submit step, select the On Form Submit to trigger the data transfer and click Next.
On the Choose Web Form step, select the Web Form and click Next. Only activated and Template/Transaction type Web Forms will be populated.
Info Only activated and Template/Transaction type Web Forms will be populated. - On the Define Source Layout step, select JSON schema as a source data format and applicable schema which is associated with Web Form as a source data layout and click Next.
On the Set Destination step, select the Destination Application from the drop-down list and click Next.
Info Depending on the chosen Destination Application, the next step differs. - On the Mapping step, click
for Mapping screen. Provide a name for this mapping and select the existing mapping from the Mapping Suggestion(s) list.
JSON schema (associated with selected Web Form) will load as Source Schema. Do the mapping of Destination with respect to Source and click Save & Exit to exit from mapping screen. Click Next.
- Provide the URL of the documentation for this Template and click Save & Exit.
- Click Yes, turn On to activate the Template.
This creates and activates your Template. - Use this Template to create a Transaction, refer to Creating a Web Form Transaction.