Form Actions - Stateless Forms

 

Description

By default, each form created in Zoho Creator will have a table generated at the backend to store data submitted through the form. For example, when you create a Contacts form, a Contacts table is created and all data submitted through this form will be stored in this table. Zoho Creator 3.0 supports creating stateless forms with scriptable buttons, that does not generate a table at the backend. You can add custom buttons and write deluge script in the "on click" event. The scripts act on the "on click" button that can be programmed to do anything you can do in Deluge Script.

Some common usage of the stateless forms are listed below:

  • Create Web Forms: Stateless Forms can act as web forms that are embedded in a website. This form data can be submitted to any service or used to update a record in another form/application, without persisting data in Zoho Creator. The Deluge Get URL and Post URL task can be used to get/post data to external websites or other Zoho Creator applications.
  • Create multiple forms updating data in a single table: By default, Zoho Creator generates a table for each database form created. To enable different type of users to access different set of form fields, you can create one main database form with all the fields and many secondary forms that will be accessed by the different type of users. For example, you can create one secondary form for the role-technician and another form for the role-manager and share it to the respective roles but persist the data submitted from all the secondary forms in the same main form / table.
  • Create user settings dialog for the real time apps: Create a stateless form to enable users to customize all the properties of an application in one single form. For example, add a Settings link to your app that will fetch the record for the current logged in user and set the values in the on load of the stateless form. Users can modify their settings and submit the form. This form will then do an update record in the main form.
  • Fetch and Display information from other forms: Create a stateless form to fetch and display information from other Zoho Creator forms or from other services, based on the form input. For instance, assume you have a Status form in your application to display the status of a particular work order. When a user inputs his workorder number and clicks on the form button, the status must be displayed. In this case, it is not necessary to store the form data. You can create a Status form and write on click form action to display the Status in a Note field.
  • Generate dynamic HTML views: Create stateless forms to generate dynamic HTML views by passing the form data as parameters to the view. For example, specify the search criteria to display records from a Contacts Management application, specify the Month and Year to display records pertaining to a specific period.
  • Execute send mail: Create a stateless form to execute any Deluge task like send mail, on click of the form button. In addition to on click form actions, you can also execute On user input field action scripts.

Syntax

When a new form is created, the checkbox Data to be stored in Zoho Creator will be selected by default. To create a stateless form without data storage,

  1. Select Form -> New Form option. In the New Form dialog, deselect the option "Data to be stored in Zoho Creator", specify the form name and click Done to create the form.
  2. Click on the Add a Button link, to add Submit, Reset and Custom buttons to the form, by specifying the button name and type.
        • Custom button: Invokes the "On Click" action of the button, if the custom button is pressed.
        • Submit button: Invokes the "On Click" action of the button, if the submit button/ enter key is pressed.
        • Reset button: Form is taken to the initial state if reset button is clicked. "On Click" action cannot be configured for reset button.
  3. Click Done to add the button to the form.
  4. In script mode, the code store data in zc = false, will be added to the form definition. To perform any action on click of the form button, write the required deluge code in on click block as shown below. For example, if the Button name is "Add", write the action script under actions -> Add -> on click
form  Sample
{
    store data in zc = false
    
    Name
    (
        displayname  =  "Name"
        type  =  text
    )

    actions
    {
        Add
        (
            type  =  button
            displayname  =  "Button 1"
            on click
            {
                 < write on click action script >
                 ...........
            }
        )
        
    }
}

Example

Assume you have created a Contact form to enter the contact details of your friends like Name, Address, Contact Number and Email id. Now you want to update some existing records which has the address/DOB field as blank. To do this, you can create a stateless form to fetch and display data from the Contact form, enter the required details and update this record in the Contact form.

  1. Create stateless Contact form with EmailId as lookup field from the Contact form, as shown in the screen-shot given below:

  1. Add on user input script to the Email_Id field of the stateless form, to fetch the corresponding record from the Contact form and display it in the current form. Refer on user input script highlighted in the Form Definition given below.
  2. When a Email id is selected, the corresponding record is fetched from the Contact form and displayed in the statelessContact Form, as shown in the screen-shot below.

  1. Update the form with required values and click on the Update button. The modified values will be updated in the Contact form. This is achieved by writing action script to update the record in the Contact form, in on click block of the Update button. Refer the code highlighted in the Form Definition given below.

Form Definition of the stateless Contact form with on click action script:

form  statelessContactForm
{
    store data in zc = false

    Lookup_1
    (
        displayname  =  "EmailId"
        type  =  picklist
        values  =  Contact.Email_Id
        on user input
        {
            r  =  ContactForm  [Email_Id == input.Lookup_1];
            input.Address = r.Address;
            input.Contact_Number = r.Contact_Number;
            input.Name = r.Name;
        }
    )

    Name
    (
        type  =  text
    )

    Address
    (
        type  =  textarea
    )

    Contact_Number
    (
        displayname  =  "Contact Number"
        type  =  number
        width  =  20
    )

    actions
    {
        update
        {
            type  =  button
            displayname  =  "Update"
            on click
            {
                r  =  ContactForm  [Email_Id == input.Lookup_1];
                r.Name = input.Name;
                r.Address = input.Address;
                r.Contact_Number = input.Contact_Number;
            }
        }
        reset
        {
            type  =  button
            displayname  =  "reset"
        }
    }
}