Working with Forms

Within Zingy, a form represents a unique type of page specifically designed to engage users in data input and facilitate the editing of existing data. Its primary objective is to establish a seamless interaction between the user and the application, enabling efficient data manipulation and updates.

Normally a form is associated with a Database Table, but you can also create custom forms that are not attached to any specific database table. Examples for both of these cases is described below.

Demonstration

The video above demonstrates a database attached form and a custom form, which are explained in more detail below.

Example Form with Database Table

In this example, we will be creating a form page and associate it with a database table named Employees.

This is done with the Table setting for the form by selecting the specific database table as shown below.

Database table fields

The image below shows the fields for the Employees database table. Please observe each field's type and sub-type.

Automatic Data Field Input elements

The page editor automatically creates data field input elements for all the fields in the associated database table. The following is a summary that outlines how the page editor employs the type and sub-type information of each field to determine the specific page element to be utilized for the data field input.

The page editor will create the data field input elements in two different styles:

Style1: where the field input elements are inside a Input Group
Style2: where they are directly utilized.

Feel free to choose a style that gels with your app. The general functionality of the form is not affected by the style chosen.

For more information on database table fields, please see Database Tables.

Based on the information about the type and sub-type of the fields you will observe the following in the demonstration video:

The First Name, Last Name fields will use an input element with type set to Text.
The Notes field will use a multi-line element.
The Department field will use a dropdown element.

Example Form with Custom Data

In this example, we will generate a custom form page that is not linked to any specific database table within your application.

This is done with the Table setting for the form by selecting Custom (No Table) option as shown below.

Custom fields

The page editor is capable of automatically generating data field input elements, even when utilizing the Custom (No Table) option. For this you will be need to define fields based on your custom requirement. The definition of each field is similar to the database fields where a type and sub-type is set along with any other required attributes.

Here we will use fields similar to the Employees database table used in the first example as shown below:

Handling form submission

Our discussion on Page Flow blocks in this context is just a brief overview. For a more comprehensive understanding of Page Flow and its various blocks, we recommend referring to the dedicated Page Flow section, which delves into this topic and explores other blocks in greater detail.

When you have a form attached to a database table, the data submission is handled automatically. However, in the case of a custom form, you manage the submission manually through Page Flow.

The Form Events block allows you to handle various stages of a user interacting with your form. The submission for custom forms is handled via the Submit Tasks flow parameter where you can take some custom action with the data entered by the user and the mark whether the operation was successful or a failure via the Set Form Event Status block. You then signal that your custom processing is complete by using the Form Submit Complete block.

In the image above, the purple function block named sendFormDataToMyCustomPlace is an example placeholder function block used to indicate that you need do take some action on the data entered by the user.

Adding Custom Logic to Forms

Page Flow allows you to add custom logic to forms (database-attached and custom forms). The following listing shows some important Page Flow blocks that are related to forms. For a complete listing of all Page Flow blocks, please see Toolbox Blocks.

Using the Form

Please refer to the section Using Forms for more information.

PreviousData Design NextUsing Forms

Last updated 10 months ago