--- title: "Corfix Form Builder: Using the Date & Time Component." description: This article will summarize how to use the Date & Time Component in Template Builder. --- [Skip to content](https://knowledge.corfix.com/articles/corfix-form-builder-using-the-date-time-component#main-content) - [English](https://knowledge.corfix.com/articles/corfix-form-builder-using-the-date-time-component) - [Español](https://knowledge.corfix.com/es/articles/corfix-form-builder-using-the-date-time-component) - [Français](https://knowledge.corfix.com/fr/articles/corfix-form-builder-using-the-date-time-component) - [Português](https://knowledge.corfix.com/pt/articles/corfix-form-builder-using-the-date-time-component) English Show submenu for translations ![black-logo (1)](https://knowledge.corfix.com/hs-fs/hubfs/black-logo%20(1).png?width=300&height=77&name=black-logo%20(1).png) Open main navigation Close main navigation - - [English](https://knowledge.corfix.com/articles/corfix-form-builder-using-the-date-time-component) - [Español](https://knowledge.corfix.com/es/articles/corfix-form-builder-using-the-date-time-component) - [Français](https://knowledge.corfix.com/fr/articles/corfix-form-builder-using-the-date-time-component) - [Português](https://knowledge.corfix.com/pt/articles/corfix-form-builder-using-the-date-time-component) English Show submenu for translations Got a question? Search the Corfix Guide! - There are no suggestions because the search field is empty. 1. [Corfix Guide](https://knowledge.corfix.com/articles?hsLang=en) 2. [Template Builder Tutorials](https://knowledge.corfix.com/articles/template-builder-tutorials?hsLang=en) 3. [Template Builder Guides](https://knowledge.corfix.com/articles/template-builder-tutorials?hsLang=en#template-builder-guides) July 24, 2025 # Corfix Form Builder: Using the Date & Time Component. ## This article will summarize how to use the Date & Time Component in Template Builder. This component allows users to input a date, a time, or both, often with the help of a calendar and time picker. --- #### Where to Find It In your Corfix Form Builder, click on a **Date & Time Component** to access the configuration panel. You’ll see four tabs: - **Display** - **Date** - **Time** - **Data** - **Validation** - **Conditional** --- ### 1. Display Tab The Display tab controls the general appearance of the Date / Time Component. - **Label:** - This is the visible title for your date/time field that users will see. It is a required field. - *Example:* "Date of Incident", "Start Time", "Completion Date & Time". - **Label Position:** - Determines where the label is displayed relative to the input field (e.g., Top, Left, Right, Bottom). - *Default:* Top. - **Allow Manual Input:** - If checked, users can type the date/time directly into the field, in addition to using the calendar/time picker. - **Placeholder:** - Text that appears inside the input field before the user types anything. It's a hint to the user about the expected format. - *Example:* "MM/DD/YYYY HH:MM AM/PM". - **Description:** - Provides additional explanatory text for the field, typically displayed below the input box. - *Example:* "Enter the exact date and time the event occurred." - **Tooltip:** - Text that appears when the user hovers their mouse over the field. Useful for providing quick help or context. - **Custom CSS Class:** - Allows advanced users to apply custom styling to the component using CSS classes. - **Hide Label:** - If checked, the label for the component will not be displayed. - **Modal Edit:** - (Details not fully visible in screenshot, but typically relates to editing in a pop-up modal window). - **Reportable:** - If checked, the data from this field will be included in reports. --- ### 2. Date Tab This tab contains specific settings related to the date input. - **Enable Date Input:** - If checked, the date selection functionality (calendar picker) will be available. - **Disable weekends:** - If checked, users will not be able to select Saturday or Sunday from the calendar. - **Disable weekdays:** - If checked, users will not be able to select Monday through Friday from the calendar. --- ### 3. Time Tab This tab contains specific settings related to the time input. - **Enable Time Input:** - If checked, the time selection functionality (time picker) will be available. - **Hour Step Size:** - Determines the increment for selecting hours (e.g., '1' for hourly increments, '2' for every two hours). - *Default:* 1. - **Minute Step Size:** - Determines the increment for selecting minutes (e.g., '1' for every minute, '15' for quarter-hour increments). - *Default:* 1. - **12 Hour Time (AM/PM):** - If checked, the time picker will use a 12-hour format with AM/PM selectors. If unchecked, it will use a 24-hour format. --- ### 4. Data Tab The Data tab manages the underlying data properties of the date/time field. - **Multiple Values:** - If checked, allows the user to enter multiple date/time values for this field. - **Default Value:** - The pre-filled date/time that appears in the input field when the form loads. Users can override this value. This is a static value. - **Default Date:** - Allows setting a dynamic default date, often using a function like `moment()` to set the current date/time. --- ### 5. Validation Tab The Validation tab defines rules to ensure the date/time entered by the user meets specific requirements. - **Required:** - If checked, the user *must* enter a date/time in this field before submitting the form. - **Use calendar to set minDate:** - Allows you to select a minimum date from a calendar, preventing users from selecting dates before this point. - **Use calendar to set maxDate:** - Allows you to select a maximum date from a calendar, preventing users from selecting dates after this point. --- ### 6. Conditional Tab The Conditional tab allows you to set up rules for when this Date / Time Component should be displayed or hidden based on the values of other components in the form. - **Simple:** - This is typically a toggle or a dropdown to select between simple and advanced conditional logic. - **This component should Display:** - Choose whether the component should "Show" or "Hide" (implied options) based on the condition. - **When the form component:** - Select another component in your form whose value will trigger the condition. - **Has the value:** - Specify the exact value that the selected form component must have for the condition to be met. *Example:* You could set up a rule so that a "Return Date" field only displays *when* "Is this a round trip?" checkbox is checked. --- ### **Preview Panel** The **Preview** panel on the right side of the dialog box shows you how the "Date / Time" input field will visually appear on your form. It typically includes a text input field and a calendar icon, giving you a real-time sense of the user's interaction. --- **Actions at the bottom of the dialog:** - **Save:** Saves all changes made to the Date / Time Component's settings. - **Cancel:** Discards any unsaved changes and closes the dialog. - **Remove:** Deletes the Date / Time Component from the form. --- ### Best Practices for Date / Time Component: - **Be Specific with Label:** Clearly state what date/time is needed (e.g., "Inspection Date", "Start Time"). - **Enable Date/Time Input Appropriately:** Only enable "Date Input" or "Time Input" if both are truly necessary. If only date is needed, disable time, and vice versa. - **Set Min/Max Dates for Control:** Use `minDate` and `maxDate` in "Validation" to prevent illogical entries (e.g., future dates for past events, or dates outside a project window). - **Consider Default Date:** For current events, set "Default Date" to `moment()` to automatically populate the current date/time, saving users time. - **Use Conditional Display:** Hide date/time fields until they are relevant, simplifying the form (e.g., show "End Date" only after a "Start Date" is entered).     - [New in Corfix](https://knowledge.corfix.com/articles/new-in-corfix?hsLang=en) - [Corfix Academy](https://knowledge.corfix.com/articles/corfix-academy?hsLang=en#main-content) - [Field Operations Training](https://knowledge.corfix.com/articles/corfix-academy?hsLang=en#field-operations-training) - [Supervisor & Foreman Training](https://knowledge.corfix.com/articles/corfix-academy?hsLang=en#supervisor-foreman-training) - [Timekeeping & Attendance Training](https://knowledge.corfix.com/articles/corfix-academy?hsLang=en#timekeeping-attendance-training) - [Product Updates](https://knowledge.corfix.com/articles/product-updates?hsLang=en) - [Corfix Admins](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#main-content) - [Dashboard](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#dashboard) - [Projects](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#projects) - [Workers](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#workers) - [Forms](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#forms) - [Templates](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#templates) - [Tasks](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#tasks) - [Certifications](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#certifications) - [Binders](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#binders) - [Reports](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#reports) - [Timekeeping](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#timekeeping) - [My Account Details](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#my-account-details) - [General](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#general) - [Assets](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#assets) - [Scheduling](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#scheduling) - [Timekeeping Exports/Integrations](https://knowledge.corfix.com/articles/corfix-admins?hsLang=en#timekeeping-exports-integrations) - [Corfix Mobile Guide](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#main-content) - [Certifications](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#certifications) - [Timekeeping & tracking IOS](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#timekeeping-tracking-ios) - [create a form on mobile](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#create-a-form-on-mobile) - [change email](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#change-email) - [Account Details](https://knowledge.corfix.com/articles/corfix-mobile-guide?hsLang=en#account-details) - [Template Builder Tutorials](https://knowledge.corfix.com/articles/template-builder-tutorials?hsLang=en#main-content) - [Template Builder Guides](https://knowledge.corfix.com/articles/template-builder-tutorials?hsLang=en#template-builder-guides) - [Template Settings](https://knowledge.corfix.com/articles/template-builder-tutorials?hsLang=en#template-settings) - [Corfix Use Cases](https://knowledge.corfix.com/articles/corfix-use-cases?hsLang=en) - [Getting started](https://knowledge.corfix.com/articles/getting-started?hsLang=en) - [Reviewing Templates](https://knowledge.corfix.com/articles/reviewing-templates?hsLang=en#main-content) - [Reviewing Templates](https://knowledge.corfix.com/articles/reviewing-templates?hsLang=en#reviewing-templates) - [Corfix Connect](https://knowledge.corfix.com/articles/corfix-connect?hsLang=en) - [Corfix Payroll](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#main-content) - [Getting Started](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#getting-started) - [Employee Setup](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#employee-setup) - [Running Payroll](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#running-payroll) - [Troubleshooting](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#troubleshooting) - [Taxes and Compliance](https://knowledge.corfix.com/articles/corfix-payroll?hsLang=en#taxes-and-compliance) - [Pat's Inside Scoop](https://knowledge.corfix.com/articles/pats-inside-scoop?hsLang=en) - [Integrations](https://knowledge.corfix.com/articles/integrations?hsLang=en#main-content) - [Acumatica](https://knowledge.corfix.com/articles/integrations?hsLang=en#acumatica) [![Chill listening crop-3](https://knowledge.corfix.com/hs-fs/hubfs/corfix_logo_primary_blue.png?width=94&height=24&name=corfix_logo_primary_blue.png "Chill listening crop-3")](http://www.corfix.com) Copyright © 2026, Corfix