Create an Application

Create an Application

Overview

This tutorial teaches you how to create a cloud app in Zoho Creator. The core components of a Zoho Creator app are:

  • Forms to submit data.
  • Reports and Pages to view data in multiple formats.
  • Workflows to implement logic and perform tasks under certain conditions.

In addition, the app automatically supports:

  • Built-in security with role-based access control.
  • APIs to integrate with external applications.
  • Publishing the components to websites and blogs.
  • Mobile access.

Create a simple "Order Management" app

  1. Login into your Creator account, and click on + New Application option on the top right corner of your Home page.
  2. There are 3 options to create an application : Application gallery to install a ready made app, Import File to import data and create an app, From Scratch to create an app from scratch. Here, we will create an application from scratch.
  3. Select Create from Scratch and enter the Application name as Order management. Now click on Create.

  4. The application Order Management gets created and you land on the form builder page.

Create a Products form

Let us create a Product form that will store the inventory details like Product name, price etc.

  1. On the right, specify the Form title as Products under Form Properties
  2. Add the following fields to the Product form. Fields can be added by dragging and dropping them on to the form. 
  • Drag and drop the single-line field and name it as Product. This field is used to enter the Product name.
  • Drag and drop the currency field and name the field as Price. Select the currency type as "USD". This field is used to enter the Price per unit of the product.
  • Drag and drop the number field and name the field as Available Stock.

Create an Orders form

Now let us create another form, Orders. This form will be used to place orders and maintain details like customer name, order date etc.

  1. Click on Create New - Form option on the left.

  2. Name the new form Orders. Now add the following fields to the order form.
  3. Drag and drop the Single line field type and name it as Name, to enter the name of the person who is placing the order.
  4. Drag and drop the Email field type and name it as Email, to enter the email address of the person who is placing the order.
  5. Drag and drop the Date field type and name it as Order Date to enter the date of order.

Create relationhsip between Orders and Products form

Now let us create a relationship between the two forms. When you create a relationship, you tell Zoho Creator to link a record in one form to one or more records in another form. 

A lookup field is added to create this relationship. Let us create a lookup field in the Orders form to relate it with the Products form. This allows the products added in the Products form to show up in the Orders form.

  1. Open the form builder and drag-and-drop the lookup field on the Orders form. 
  2. A pop up appears where you need to choose the Application - Form - Field with which you want to relate the Orders form. 
  3. Select Order Management - Products - Product. You can choose the type of this field. In this example, we have selected Multiselect, so that multiple products can be selected for a single order.  
  4. Click on Done to save the changes. The Orders form is now linked with the Products form through the product field.

    Note: Adding a multiselect lookup field creates a one-to-many relationship between the Orders and Products form, i.e., a user can select multiple products in an order. But a limitation with this lookup field is that a user cannot specify the quantity that he needs to order for each product. So, we assume that only one piece (quantity) of each product can be present in an order. In the Advanced App Building Tutorial, we will learn to create this relationship (between Orders and Products form) using the SubForm field.

  5. Now let us add a field for delivery type of the products ordered. Drag and drop the Checkbox field type and name it "Delivery". In Choices under Field properties type in "USPS Priority (1 - 2 days)" for the first choice, "USPS 1st class (2 - 3 days)" for the second choice and "USPS Standard(3 - 4 days)" for the third choice. Your Orders form should now look like the following screeshot:

Access the application

Now that we have created a basic application with simple forms and fields, lets see how it works in the live mode. To access this newly created application,

  1. Click on Access this application on the top right corner. You will be redirected to the live mode of your application.

  2. In the live mode, you can see the two forms created by you. Each form is present under the header of the form name. Products stands for the Products form and Orders stands for the Orders form.
  3. Fill in the Products form with sample entries. Lets say, you fill the product field as "LG 70 inches 3D" and enter the price as "690".
  4. Now go to the Orders form and enter sample entries. You will notice that the field Product contains "LG 70 inches 3D" in the drop down, which was actually entered in the other (Products) form.

This is how relationship between two forms is achieved.

View reports and Add records

Under each form name, you will notice there is a Report tab along with the form. The Report section stores all the data recorded through forms. The data can be viewed in different formats like list, summary, grid and spreadsheet. 

  1. To view records in different formats, click on Settings icon on the top right corner and go to View as. Now select the format you wish to apply. 
  2. From Reports section you can also add records. 
  3. Click on "+" icon in the top right to access the form and add records.

Share the app with users

Now let us put this application to use. Applications are built for users who make use of them to submit and view data. Users can access the app if it is shared with them by the app-owner and also based on the access permissions provided to them.

  1. To share the application with users, go to the Application settings - Share. Here you can specify:
  • Which components of the application you want to share.
  • With whom (which users) you want to share.
  • Select your options and click on Share Now to activate the changes.

Customize the app

Zoho Creator, after all, is not just about logic. It also has immense scope for your creative minds. You can manage the theme in which the application is accessed.

  1. Access your application.
  2. Click the wrench icon displayed beside your profile name in the bottom left side the your screen.
  3. In the menu that opens, click Themes. A pane will appear from the right end of your screen.
  4. Select the required theme and icons.

Share this post : FacebookTwitter

Still can't find what you're looking for?

Write to us: support@zohocreator.com