> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mileapp.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Date Time

The **Date Time** input type enables field workers to enter both a date and a time in a single field as part of a task.

## What is the Date Time Input?

Date Time captures a combined timestamp (calendar day plus clock time) presented as a date-time picker on both the web form and the mobile app. The stored format is `Y-m-d H:i` (e.g., `2026-05-19 14:30`).

**Use Cases:**

* **Appointment schedule**: Record an appointment's exact date and time
* **Task timestamp**: Capture the specific moment an event occurred (e.g., installation start time)
* **Pickup window**: Record the agreed pickup datetime for a courier task

## Date Time Properties

<div align="center">
  <img src="https://mintcdn.com/mileapp-c1584fbc/OPAMjeo91qoaLUGM/images/flow/component-input-date-time-settings.png?fit=max&auto=format&n=OPAMjeo91qoaLUGM&q=85&s=c9ba6545d684178c888e8453651e06bc" alt="image" width="600" data-path="images/flow/component-input-date-time-settings.png" />

  <p><i>Component date time input settings</i></p>
</div>

1. **Default Value:** This setting allows you to set a pre-filled date and time for this component. If a value is specified, any task created with this flow will use it as the initial value. The format follows `dd/mm/yyyy hh:mm`.
2. **Toggle Required:** This option makes the date time input mandatory. If not filled, users cannot proceed to other activities.
3. **Toggle Visible:** This setting affects the visibility of the component during task creation on the web and mobile, as well as task viewing on the mobile app. If the component is not visible, it will not be shown in the UI. However, both visible and hidden component data will be exported, regardless of their visibility status.
4. **Show As:** This configuration, controls how the input value is displayed within the task. The value of this component will appear on the task table in the **Task** menu as the **Title**, **Content**, or **Label**, depending on the option selected.

## How to Configure Date Time

### Step 1: Add the Component

In the Flow Builder, click **Add Component** on the target page. Set **Component Type** to **Input** and **Type Of Input** to **Date Time**.

### Step 2: Set Basic Properties

Enter the component **Title** (e.g., "Appointment Time"). Toggle **Required** and **Visible** as needed. Optionally enter a **Default Value** using the `dd/mm/yyyy hh:mm` format.

### Step 3: Configure Show As (optional)

In the **Configuration** section, set **Show As** to **Title**, **Content**, or **Label** to control how the date time value appears on the task list in the Task menu.

## How Date Time Works in Tasks

<div align="center">
  <img src="https://mintcdn.com/mileapp-c1584fbc/OPAMjeo91qoaLUGM/images/flow/component-input-date-time-mobile.png?fit=max&auto=format&n=OPAMjeo91qoaLUGM&q=85&s=6195240c8b7f32e4f8c2db5adc75723f" alt="image" width="300" data-path="images/flow/component-input-date-time-mobile.png" />

  <p><i>Date Time input on mobile preview</i></p>
</div>

When a field worker opens a task on the mobile app:

1. The Date Time field shows a **date and time picker** with the format `dd/mm/yyyy hh:mm`
2. The field may already be populated:
   * **From task creation**: If the task was created with a date time value, it is pre-filled
   * **From Default Value**: The flow-level default appears if no value was provided at creation
3. The worker can change the date and time before completing the page

## Related

* [Date Component](/pages/flow/flow-builder/component-input-type/date) — Captures date only
* [Time Component](/pages/flow/flow-builder/component-input-type/time) — Captures time only
* [Input Component Overview](/pages/flow/flow-builder/component-input-type/component-input)
