Page script and variables | Zoho Creator Help

Page script and variables

1. What does this page cover?

Learn about page scripts, their creation and subsequent usage inside the pages component to populate dynamic values in your page elements, thereby minimizing the need for multiple snippets in your page.

2. Availability

  1. Page scripts is available in all the data centers.
  2. They can be created in all the pricing plans of Creator.
  3. They can only be created by the super admin, admins, and developers, while other users can view them with in live mode with relevant permissions.

3. Overview

In general, a code script refers to a block of code or a function that is created to handle a specific request. In other words, a script executes the configured actions or provides the necessary response when a particular event or condition occurs. For example, you can configure a script to be associated with user actions such as clicking a button or pressing a key. These scripts provide a mechanism to define the desired output when specific events occur and allow developers to control the flow and response of the script in various scenarios.

4. Page scripts and variables in Creator

In Creator, page scripts are functions that can be created to accomplish common tasks inside pages. These functions enable you to write your own logic using Deluge scripting language, enabling you to dynamically fetch and populate required values across all the page elements using page variables.

Page script lets you manage the entire script for a page in one place — the Page Variables & Script tab. Upon accessing your page in live, the script will be executed and values populated in the configured elements.  
Note: You can create only one script in a page in your Creator application.
Page variables are used to store values within your scripts. These variables have a data type that determines the kind of data they can hold, such as numbers, strings, or boolean values. These variables allow you to store data, perform calculations, and control the execution flow of your script.
You need to create the page variables in the Variables tab first i.e., you cannot create variables while writing a script.
You can assign a name to these variables, ‌which in turn can be used as variable references inside the script and page elements.
  1. It is recommended to specify variable names as something meaningful and descriptive, so that they can be easily understood in a complex function.
  2. You'll be warned when you use a restricted word to name the page variable.
You can assign values to the page variables in the Deluge code editor. Currently, we support the following data types for page variables: string, int, boolean, float, and collection

Creator supports collection variables such as
list and map. A list variable stores a list of values. Eg. list_var = ["john", "smith", "emma"]. The values in the list can be accessed by using its index. In this example, "john" can referred as list_var[0] where 0 is the index. Similarly, "smith" can be referred to as list_var[1] and so on.
A map variable stores values in key-value format. Say map_var = {"name":"stevin","gender":"male","age":"30"}. The values in the map can be accessed by using its key. Here the value for gender can be retrieved by specifying its key as map_var("gender") where "gender" is the key and its value is "male".
‌Note: You can apply display formatting to variables with integer and float data types.
You can verify if the page script you've configured is working as expected by executing the page script. Page variables can be provided with test values in the Execute pop-up or assigned values in page script and executed. This helps to identify errors in your script and rectify them.

5. See How It Works

Let's assume you've built an Employee Management Creator application in which you've created a page titled Employee Dashboard. When employees login to their respective dashboards, this page will list their details including the number of sick and casual leaves available. You (admin/super admin) can configure a page script that dynamically populates these values when employees login. The below video shows how the required details are auto-populated based on the employee's logged-in email address.


6. Syntax

6.1 General syntax

Note: This syntax applies to the following page elements — panel, chart, gauge, search (criteria), embed forms and reports (field values), buttons (query parameters), and embed snippet. Learn more
  1. ${variable_name}
Here, variable_name refers to the name you had assigned to the page variable.

Depending on the type, a collection variable can be retrieved by providing either a key or index. The syntax for a collection variable is as follows:

  1. ${collectionVar.get(0)}
where 0 denotes the index.

  1. ${collectionVar.get("Name")}

where Name denotes the key.

6.2 ZML snippet

The syntax to use a defined page variable inside a ZML snippet is as follows.
  1. <text  type='variable' value='${variable_name}'> </text>

6.3 HTML snippet

The syntax to use a defined page variable inside an HTML snippet is as follows.
  1. <html tag><%=input.variable_name%></html tag>

6.4 Query Parameters

You can pass collection variables as a query parameter to another page after encoding the values of those variables.

 
For a map collection variable, pass the query parameter as shown below:
collectionVar = {"name":"stevin", "gender":"male"}
query param:  ?collectionVar=%7B%22name%22:%22stevin%22,%20%22gender%22:%22male%22%7D

For a list collection variable, pass the query parameter as shown below:

collectionVar = ["john","smith"]
query param:  ?collectionVar=%5B%22john%22,%22smith%22%5D

    7. Using page variables 

    The page elements where variables can be used are listed below:
    1. Panels:

      1. Display: The display aspect of text and button in a panel can be configured to display the required data in place of the page variable.
      2. Action: The action aspect of text, image and button in a panel can be configured to display the required data in place of the page variable.
      3. Image: The images in a panel can be configured to display the required data in place of the page variable.
    2. Chart: You can set a filter (criteria) or use ZML attributes to filter the data based on the page variable.
    3. Gauge: You can set a filter (criteria) or use ZML attributes to filter the data based on the page variable.
    4. Search: The search element can be configured to display the search results (page or report) based on the page variable.
    5. Form: You can set the value of the fields in a form to display the data based on the page variable.
    6. Report: You can set a filter (criteria) or use ZML attributes to filter the data based on the variable.
    7. Snippets: You can display data inside HTML and ZML snippets based on the variable value. 
    8. Button:
      1. Display: The display aspect of a button in a panel can be configured to display the required data. Learn how
      2. Action: The action aspect of a button in a panel can be configured to display the required data. Learn how
      3. Image: The images in a panel can be configured to display the required data. Learn how

    8. Use Cases

    1. Display data from two different forms - Let's assume that you've created a Sales Management application using Creator. In the Employee Dashboard page, you want to populate the values of the total number of deals won by an employee, along with the individual count of deals won via chat and call. By creating a script that stores the values of the required records from the respective forms inside the page variables, you can display the required values inside a panel element in place of those variables.

    2. Display populated data upon button click - ‌Let's assume that you've created a Hotel Management application. In the Guest Dashboard page, you've placed a button to enable your patrons to check in and check out with just a single click. You want your guests details, such as their booking ID, name, and email address, to be pre-populated when the Check-In form opens upon clicking the button. To achieve this, you can configure a button action and specify the variable name in the query parameters. When guests who have made room reservations click the Check-In button in your page, they'll be redirected to the Check-In form and can view the populated data as configured.
    3. Dynamic search using criteria - ‌Let's assume that you've created a Partners Event Management application. In the Dashboard page, you've added a search element that enables partners to search for events. You want them to search for events that are happening only in their respective countries/locations. You can set a search criteria that will search events based on the partner's country and display the desired results. Here, the criteria specified is the page variable that stores details of events happening across countries. You can write a script that fetches and displays events based on partner's countries. This makes it easier for partners to access events details associated with their location.

    9. Navigation Guide for Creation of Page Script

    In the Edit mode of the application, when the application name at the top-left is clicked, the screen shows the different components created in that application. You need to select the required page and click the Open Page Builder button. Here, you can find the  icon at the top. Upon clicking it, you can find both the Page Variables and Script tabs. 


    10. Prerequisites

    To write a page script, you need to create variables first. These variables can then be used inside the script.

    11. Points to Note

    1. You can create a maximum of 50 variables for a page.
    Note: If you've created page parameters previously, they'll also be counted in the 50 variables limit as mentioned above. For example, lets assume you've created 60 parameters earlier. They'll be listed in the Page Variables tab and will continue to work as per the previous configuration. However, you'll not be able to create new page variables. You need to delete the parameters to accommodate the creation of new page variables.
    1. A variable name can contain a maximum of 50 characters
    2. Page variable names are case-sensitive.
    3. You can name variables using letters (English), numbers, and the underscore character (_).
    4. A variable name must start with an alphabet. 
    5. You can pass record ID and date values as page variable values.

    12. Limitations

    1. Currently, you can only create one script (function) per page in your Creator application.
    2. You cannot call a script across pages inside Creator applications.
    3. If you had created page parameters previously, they cannot be edited (they would still continue to work according to their configuration). However, you can delete such parameters.
    4. You cannot perform write operations like adding or updating data using page scripts.
    5. The following Deluge tasks will not be listed while configuring the script for page script.
      1. Data Access
        1. Add records
        2. Update records
        3. Delete records
      2. Web Data
        1. postUrl
        2. openUrl
      3. Misc
        1. Send mail
      4. Sharing permissions
        1. Assign profile to app user
    6. You cannot create a custom Deluge function in page scripts.
    1. Configure page script
    2. Understand pages

      Zoho CRM Training Programs

      Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.

      Zoho CRM Training
        Redefine the way you work
        with Zoho Workplace

          Zoho DataPrep Personalized Demo

          If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.

          Zoho CRM Training

            Create, share, and deliver

            beautiful slides from anywhere.

            Get Started Now


              Zoho Sign now offers specialized one-on-one training for both administrators and developers.

              BOOK A SESSION









                                        You are currently viewing the help pages of Qntrl’s earlier version. Click here to view our latest version—Qntrl 3.0's help articles.




                                            Manage your brands on social media

                                              Zoho Desk Resources

                                              • Desk Community Learning Series


                                              • Digest


                                              • Functions


                                              • Meetups


                                              • Kbase


                                              • Resources


                                              • Glossary


                                              • Desk Marketplace


                                              • MVP Corner


                                              • Word of the Day


                                                Zoho Marketing Automation

                                                  Zoho Sheet Resources

                                                   

                                                      Zoho Forms Resources


                                                        Secure your business
                                                        communication with Zoho Mail


                                                        Mail on the move with
                                                        Zoho Mail mobile application

                                                          Stay on top of your schedule
                                                          at all times


                                                          Carry your calendar with you
                                                          Anytime, anywhere




                                                                Zoho Sign Resources

                                                                  Sign, Paperless!

                                                                  Sign and send business documents on the go!

                                                                  Get Started Now




                                                                          Zoho TeamInbox Resources



                                                                                  Zoho DataPrep Resources



                                                                                    Zoho DataPrep Demo

                                                                                    Get a personalized demo or POC

                                                                                    REGISTER NOW


                                                                                      Design. Discuss. Deliver.

                                                                                      Create visually engaging stories with Zoho Show.

                                                                                      Get Started Now









                                                                                                          • Related Articles

                                                                                                          • Understand Variables

                                                                                                            What Does This Page Cover? Learn about variables that hold values that can be referred to and modified throughout your Creator application. Availability Variables are available for all plans of Creator. Only super admin, admins, and developers can ...
                                                                                                          • Create and Manage Variables

                                                                                                            1. What Does This Page Cover? Learn how to create a variable to hold values that can be referenced and modified throughout your Creator application. Learn more about variables and its significance before moving ahead. 2. Availability Variables are ...
                                                                                                          • Configure page scripts

                                                                                                            1. What does this page cover? Learn how to add page variables, create page script and subsequently use them inside the pages component to populate dynamic values in the page elements upon loading your page. 2. Availability This feature is available ...
                                                                                                          • Understand Page Builder

                                                                                                            1. What Does this Page Cover? Learn about the page builder and how you can customize your page and its elements according to your business needs. 2. Availability Pages can be created in all plans of Creator. Only the super admin, admins, and ...
                                                                                                          • Add widget to a page

                                                                                                            This help page is for users in Creator 6. If you are in the older version (Creator 5), click here. Know your Creator version. To add a widget to a page: Access the application to view and use the widget that you configured. Navigate to the Design ...
                                                                                                            Wherever you are is as good as
                                                                                                            your workplace

                                                                                                              Resources

                                                                                                              Videos

                                                                                                              Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                                                                                              eBooks

                                                                                                              Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                                                                                              Webinars

                                                                                                              Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                                                                                              CRM Tips

                                                                                                              Make the most of Zoho CRM with these useful tips.



                                                                                                                Zoho Show Resources