How to Model Rich Forms

by Michela Frigerio
8,156 views Published on Oct 30, 2017
Applies to: 7.2 or higher
Table of contents

Introduction

Rich forms are forms in which the user interaction triggers an event and the execution of a specific business logic. The aim is facilitate the form compilation and improve the user’s experience in the web Application. Many events can be managed to enrich the user’s interaction with a form, and some of them are change, blur, focus, keyup and keypress. In the following section, you will see how to configure the change event. Any other form event can be modeled in the same way. The only difference is that you have to select the proper event from the “Event Type” field.

 

Configuring the Change event

Let’s see how you can manage form events in WebRatio Platform. Suppose to have a page on which you manage companies’ information and you want the web application to automatically set the “prefix” for the telephone number field depending on the user’s selection in the “country” field. The following image shows the desired behavior.

 

The starting WebRatio model is shown in the following image. In particular when the user selects a country in the dedicated field, the “Select Country” selector operation is executed, and it retrieves the corresponding prefix. The prefix is then used to preload the “phone number” field.

 

Based on the model shown previously, the steps to model the On Change Event are:

  1. Select the Form Component.
  2. Select the Outline View.
  3. Select the “country” selection field, which is the field you want to trigger the event.
  4. Select the AJAX tab in the Properties View.
  5. Check the Enable Event property.
  6. Select "On Change" in the Event Type property.
  7. Press the Select button next to the Event Flow property and select the navigation flow connecting the Form Component with the Selector Operation.

 

NOTE. Remember that if the Form Component containing the desired field has a Validation Rule attached, you must disable the “Validate” flag of the Navigation Flow attached to the event. Otherwise, the event will not be triggered.