Form Wiring
...
Form Wiring enables the users to assign different actions for different events. This functionality is applicable for the entire form. The coding requirements have been eliminated and the functionality of Form Wiring paves the way for easier and effective configurations.
Form Wiring
To manage the features of Form Wiring, perform the following steps in Canvas Studio. :
Let us assume that a form, with a form ID, NEW_PAYEE_FORM has already been created.
- On the home page of Canvas Studio, click Form Definition on the left navigation pane.
...
The Form Definition List appears.
...
- Right-click the NEW_PAYEE_FORM and select the Edit Form option.
...
The Edit Form page appears.
...
The Form Wiring icon
...
appears on the top right side of the Edit Form page.- Click the Form Wiring icon
.
...
The Form Wiring window appears.
...
The listed events are: Pre Model Load, Post Model Load, Pre Initialization, Post Form Renderer, Form Before Initialization, AJAX Success and AJAX Failure. For more information on events, refer Form Handlers.
...
- Type the name of the actions in the search box of Search APIs. The rule text box is an editable field and you can assign the name of your choice, as the rule name. For more information, refer Form and Form Item APIs.
...
For the events of AJAX Success and AJAX Failure, you must upload appropriate JSON files. When the mode of communication with the server is successful, then you can select the event of AJAX Success, and when the established communication with the server gets failed, then you can select the event of AJAX Failure.To upload the JSON file, click the option of Choose file and select the apt JSON file.
...
Tip The configuration screens are same for both the events of AJAX Success and AJAX Failure.
...
The icons, on the left side, comprise of various actions; that can be assigned for the different set of listed events.
...
The if class
...
allows you to assign configurable values for the form items. Using AND, OR gates, you can assign the specific set of configurable values. The Add group and Add rule functionalities pave the way for you to add groups and rules respectively.
...
The
...
-
icon represents Favorites category. The actions, categorized under the section of Favorites, have been depicted in the following screen shot.
...
The
icon represents Add category. The actions, categorized under the section of Add, have been depicted in the following screen shot.
...
The
...
-
icon represents Display Configuration (DisplayConfig) category. The actions, categorized under the section of DisplayConfig, have been depicted in the following screen shot.
...
The
...
-
icon represents Data Configuration/Reset (DataConfig/Reset) category. The actions, categorized under the section of DataConfig/Reset, have been depicted in the following screen shot.
...
The
...
-
icon represents Enable/Show category. The actions, categorized under the section of Enable/Show, have been depicted in the following screen shot.
...
The
...
-
icon represents Disable/Hide category. The actions, categorized under the section of Disable/Hide, have been depicted in the following screen shot.
...
%20-%204.png?version=1&modificationDate=1603729313061&cacheVersion=1&api=v2&width=896)
The
...
-
icon represents Action/Launch category. The actions, categorized under the section of Action/Launch, have been depicted in the following screen shot.
...
%20-%205.png?version=1&modificationDate=1603729638582&cacheVersion=1&api=v2&width=897)
The
...
-
icon represents Remove category. The actions, categorized under the section of Remove, have been depicted in the following screen shot.
...
%20-%204.png?version=1&modificationDate=1603729751118&cacheVersion=1&api=v2&width=896)
To configure the if class, click
icon. Select the event, Post Form Renderer. Click Select drop-down list to select a form item, e.g. TEXT_FIELD937 (Account No). Tip The option, isFormValid prompts the user to assign a possible value, which is either true or false.
...
- Once, you select the text field of your choice, a couple of drop-down lists appear. From the list of options, provided in the drop-down list, choose an appropriate value, as shown in the following screen shote.g. equal.
...
- After selecting the appropriate value, proceed to select another form item, e.g. TEXT_FIELD145 (Confirm Account No) from the drop-down box, as shown in the following screen shot.
...
- Click Save to save the rule.
...
The created rules are categorized under the segment of Rules List, which appear on the right side of the window.
...
Several actions can be applied for a single event.
There are no restrictions placed on the limits.You can configure different actions for the same event.
For instance, if you wish toTo disable a form item
; then click, select the Disable form items in
formform action.
...
A modal window, titled as Disable form items in form appears.
...
- Click the Field Name and select a form item, e.g. (OTP_FIELD463). There are no restrictions placed on the selection of form items and Based on your needs and requirements, you can even select multiple form items.
...
- Click Save.
...
- Click Save to save the rule. To edit the rule, click
icon, whereas to delete the rule, click 
icon.
...
The newly created rule appears under the category of Rules List, which can be found on the right side of the window.
...
Click
icon to exit the page.
...
- Click Save
to save the form.
...
A confirmation message, indicating a successful save appears.
...
- Click Ok.
Let's presume that the form, NEW_PAYEE_FORM has been mapped to the app, New Form, which in turn, is mapped to the workspace, titled as Payee Form. The following screen shot serves as a good illustration of the output in the functional application, Modelhouse. The selected event type was Post Form Renderer, while the OTP Field was disabled by using the Disable form items in forms action. On viewing the following screen shot, it can be clearly noticed that
...
- the OTP Field is disabled.
...
