Time Field Element

04/08/2021
IMPORTANT NOTE: This is a Form Element – available only when using the Form Builder in Avada Forms.

The Time Field Element allows a user to select a specific time in hours and minutes. You can see an example of this Element in the Reservation Prebuilt Form.

View Element Demo Page!

Overview

How To Use The Time Field Element

The Time Field Element allows you to place a time selector into your forms.

Step 1. Create a new, or edit and existing Form in the Avada Form Builder.

Step 2. Create, or choose the Column you wish to add the Element into.

Step 3. Click on Add New Element and choose Time Field from the Form Elements tab.

Step 4. The main unique options to look at in this Element are the Custom Picker, and the Clock Type, Otherwise, configure the Element as any other Form Element.

Step 5. Once you have configured the Element, save your page.

Read below for a description of all element options.

Avada Website Builder

739,319 Businesses Trust Avada

Get Avada
Avada Website Builder

739,319 Businesses Trust Avada

Get Avada
Avada Website Builder

739,319 Businesses Trust Avada

Get Avada

Element Options

Location: The edit screen within each Element. You access the Form Builder Elements when adding an Element while editing a Form in the Avada Form Builder (Forms > Form Builder, from the Avada Dashboard).

Note: Please note that the displayed options screens below show ALL the available options for the element. If you have Avada’s Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.

General Tab

  • Field Label – Enter the label for the input field. This is how users will identify individual fields.

  • Field Name – Enter the field name. Should be single word without spaces. Underscores and dashes are allowed.

  • Required Field – Make a selection to ensure that this field is completed before allowing the user to submit the form.

  • Placeholder Text – The placeholder text to display as hint for the input type. If tooltip is enabled, the placeholder will be displayed as tooltip.

  • Tooltip Text – The text to display as tooltip hint for the input.

  • Custom Picker – Choose to enable a lightweight custom picker on mobile only, mobile and desktop or set to never to use browser native. Choose from Never, Desktop Only, or Always.

  • Clock Type – Choose between 12 hour and 24 hour clock type. Note, will only work for custom picker type. Choose from 12 Hour, or 24 Hour.
  • Input Field Icon – Select an icon for the input field, click again to deselect.

  • Tab Index – Tab index for this input field.

  • CSS Class – Allows you to add a class to the wrapping HTML.

  • CSS ID – Allows you to add an ID to the wrapping HTML.

View The Options Screen

Conditionals Tab

  • Conditional Logic – Add conditional logic for the input field. Please see the Conditional Logic In Avada Forms document for more information on how to use this feature.
View The Options Screen

Global Options

There are no Global Options for Form Builder Elements.

Avada Website Builder

739,319 Businesses Trust Avada

Get Avada
Avada Website Builder

739,319 Businesses Trust Avada

Get Avada
Avada Website Builder

739,319 Businesses Trust Avada

Get Avada