Single Select Fields

Overview

Single select fields allow users to select one entry from a list of pre-set choices, instead of typing one. Zoho Creator supports the following types of single-select fields:

  • Drop-down: A drop-down list provides the user with many choices in a limited space. It allows the user to choose one (and only one) option from the list of choices. A drop-down list takes two or more clicks (to open the list, scroll, and select) to make a selection. The user makes a selection by clicking in the list. Once an item is clicked, it becomes highlighted indicating that it is the current choice.
  • Radio button: Radio-buttons also allow the user to choose only one option from a list of choices displayed. They are easier to read and require fewer interactions/clicks to use. Sure, they take up more space, but in Forms where maximizing space is not an issue, but visibility of available options is, then radio buttons would be a better UI choice. The radio buttons can also be arranged in one, two or three columnar layouts.

Screen-shot of a sample form with radio-button and drop-down list choices

Refer the topic, conditional drop-downs to populate list values dynamically.

Configuring a drop-down field type

Drag-n-drop the Dropdown field type to the editor area as shown in the image below.

The Field Properties are displayed as shown below.

In the Field Name textbox, enter the Field name that will be displayed in the form. The Deluge name of the field will be same as the field name with underscore instead of white spaces, and will be assigned automatically by Zoho Creator. This name is used to refer to the field in script mode. 

In the Choices textarea, enter the choices to be listed for this field, one per box.

  • Specify the field configurations if required. If you want the drop-down choices to be displayed in alphabetical order, select the checkbox "Alphabetical order". Refer the link Field Configurations to learn more about each configuration.

You can edit the field configurations or delete the field or add field action scripts in the field properties. 

When you Access the application, the drop-down field will be displayed in your form with the specified choices. Users can open the list and make the required selection.

Configuring a Radio button field type:

Drag-n-drop the Radio field type to the editor area as shown in the image below.

The Field Properties are displayed as shown below.

    • In the Field Nametextbox, enter the Field Label name that will be displayed in the form.
    • In the Choices textarea, enter the choices to be listed for this field, one per line.
    • You can specify the field configurations if required.
    • By default the radio buttons will be arranged as one columnar layouts. To arrange them in two or three columns, select the required option from the "Field Layout" list box.

If you want the drop-down choices to be displayed in alphabetical order, select the checkbox "Alphabetical order". Refer the link Field Configurations to learn more about each configuration.

You can edit the field configurations or delete the field or add field action scripts in Field Configurations.

When you Access the application, the radio button field will be displayed in your form with the specified choices. Users can make the required selection.

Validation

Make Field Mandatory

Setting a field to Mandatory, forces the user to fill a value for the particular form field. 

GUI

To make a field mandatory through GUI, please refer the following link.

Script 

To make a field mandatory through script,

  • Go to edit mode of the application.
  • Click on the Form Actions --> On validate from the workflow tab.
  • Enter the code and click on "Save script " button.
  • The mandatory option is now enabled for the particular field.

For example, the sample script shown below indicates the user that the field value is mandatory and requires data to be entered in the field.

if ( (input.Product == "") )
{
alert "Please enter the value for the field";
cancel submit ;
};

In the above code, input.Product is the field where the field value is mandatory.

Permission

The permission option supports the show/hide functionality to create forms that hide the information from the user or adjust the fields while the user is entering the data . There are two possible ways to perform this action.

GUI

To enable the show/hide functionality from the GUI, please refer the following link.

Script
  • Go to  Form Actions -> on add ->on load .
  • Enter the code and click on "Save script " button.
  • Now access the application to find the changes made in the script section.

In the Form Actions -> on add ->on load script of the form, hide the required fields, for example, Field 1 and Field 2 by adding the following piece of code as shown below.

hide <field name>;