Date Range Settings

The date range attributes are configured using the Date Range Settings screen.

The following options are available:

Content

Customize the content options and determine how other elements appear in the Date Range input element.

Content settings screen
#OptionFunction
1Show LabelLabels help users understand what data they should provide. Depending on your business needs, you can choose to show or hide label fields.
2LabelAdd labels to your various text fields to give them meaning. Use the Labels option to easily track, map, and identify elements.
3PlaceholderUse Placeholder text to indicate to the user the information they should provide to gain quality data for your business needs. The Placeholder option can be used for different elements, such as Email, URL, and Text when there is no label; for example, you can use it to guide the user about the information they must provide.
4Date FormatEasily choose and customize which Date Format best suits your business needs. The Date Format option is available for all the date elements.
5Use current date rangeThe Use current date and time option is available for the date and time elements. This setting automatically selects the current date and time, which means the data captured is accurate.
6Default ValueUse the Default Value to set a value that will be automatically filled in just a few clicks. This option is available for elements, such as Date, Time, Email, Number, Slider, and more.
7Start DateYou can add a start date to a date range. This applies to the date range input field as well as the date range widget.
8End DateYou can add an end date to a date range. This applies to the date range input field as well as the date range widget.
9MonthsYou can select the number of months you want to display. This applies to the date range input field and the date range widget.
10User TipAdd brief instructions or context to each input field using User Tips. 

Interactivity

Customize the interactivity options and determine how your user can interact with the Date Range input element.

Interactivity screen
#OptionFunction
1Hide onloadUse the Hide Onload option to hide specific elements on load to control what the user sees. It allows you to hide an element when the page is loaded.
2Disable TooltipTooltips give information to the user; however, when they are not necessary for self-explanatory fields, they may make fields look cluttered. You can disable the tooltip.
3DisableThe user will not be able to type any text when this option is active.
4MandatoryUse the Mandatory setting to mark various input fields as mandatory. The user will not be able to continue when a mandatory field is not complete.
5Auto FocusWhen you have multiple questions, you can guide the user to start answering specific questions by activating the text cursor to draw attention to a specific field. Use the Auto Focus feature to bring users to a specific input field when they open documents with Titan Web. You can use this option with accessibility mode.
6Read OnlyUse the Read Only function so users can view an input field but not make edits. This option allows the user to only view text; they cannot make any changes, such as deleting or editing text.
7Hide AsteriskUse the Hide Asterisk option to hide the mandatory question indicator. This option is available for different elements.
8Hide Valid TextUse the Hide Valid Text option to either show or hide the valid indicator on the element. You can configure an icon to indicate valid input.
9Hide Error TextUse the Hide Error Text option to either show or hide the invalid text on the element. You can configure an icon to indicate invalid input.
10Tab OrderUse this feature to set which fields will be active when the user presses the Tab key. This assists the visually impaired who need to navigate using the Tab key.
11Validation Icon Status Configure icons to indicate valid or invalid input. 
12SuffixUse the Suffix option to add a non-editable suffix with a specific meaning.
13Enable Clear IconUse Enable Clear Icon to assist users in clearing all input in a field.
14DirectionChange the appearance of the date range field by setting the date range to display the months in a horizontal or vertical direction.
15Month and Year pickersTo change the appearance of the date range, remove the month and year picker. Users will have to use the < and > arrows to select.
16Show Defined RangesChange the appearance of the date range by adding defined date ranges. This will give the user standardized options when selecting a date range.
17Default LocaleUse the Default Locale function to auto-translate inputs into the selected locale. This option is available for the following elements: Date Range, Date, Time, and Date Time.
18Auto Detect LocaleUse the Auto Detect Locale function to auto-translate inputs into the users’ locale, as defined in their operating system. The Auto Detect Locale option is available for elements such as Date, Time, and DateTime elements.
19Disable FutureDisable future dates and times so that a user is forced to select a date and time from today or earlier than now.
20Disable PastDisable the past dates and times so that users are forced to select a date and time from today or from now onward.
21Fixed LabelUse the Fixed Label setting to ensure your long-form content always displays to users.
22DocGen SettingsUse the Fixed Label setting to ensure your long-form content always displays to users.

Salesforce

Configure Integrations – Integrate data from Salesforce.

Conditions

Configure Conditions – Determine what will happen when your user interacts with this element.

Value Rules

Set Value Rules – Use this function to set the acceptable values for an input field. This can improve efficiency and accuracy when capturing information.

Captions

Captions – Use the Captions to provide instructions and context to users. There are different caption options available per element that will help guide the user.

Animation

Animation – This option allows you to add visual interest to your screen. Create the illusion of movement when the element shows on the screen. You can set the duration and delay to control the movement and preview by default.

Accessibility

Accessibility – Ensure people with disabilities can perceive, understand, navigate, and interact effectively with your websites.

Metadata

Metadata – See how this element is identified in the backend, such as its purpose, content, or function. Your users won’t see this.

Hidden Title

Need more help?

Titan logo
Privacy Overview

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.