---
schema_version: "1"
id: 23d8740230525f956f98c495e177d520ae515c0ad5548fd8075c9acc271379f3
title: Date & Time Screen Input Component
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/platform/264-0-0/flow_ref_elements_screencmp_datetime.md
canonical_url: https://help.salesforce.com/s/articleView?id=platform.flow_ref_elements_screencmp_datetime.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 0004e063462a41645d5398482aa80d408a6eabbe0bdb1bc47d4e053a91189323
description: Let users enter date and time values from a flow screen, such as to request an appointment.
products:
  - Flow Builder
  - Salesforce Platform
release: "264"
---
# Date & Time Screen Input Component

Let users enter date and time values from a flow screen, such as to request an appointment.

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition"><colgroup><col></colgroup><tbody><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;"><a href="https://help.salesforce.com/s/articleView?id=platform.flow_ref_supported_editions.htm&amp;release=264.0.0&amp;type=5" title="Learn about the editions and user interfaces that support Flow Builder. Some Flow Builder features integrate with other Salesforce products that require additional licenses.">View supported editions.</a></td></tr></tbody></table>

## Configure the Date & Time Component

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col style="width:24%">
          <col style="width:76%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e68">Attribute</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e71">Description</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">API Name</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">
              <p>The API name of the component.</p>
              <p style="margin-bottom:0;">An API name can include underscores and alphanumeric characters without spaces.
                It must begin with a letter and can’t end with an underscore. It also can’t have
                two consecutive underscores.</p>
            </td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Default Value</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">
              <span>Pre-populated value for the component.
                If the associated screen isn’t run or the conditions for component visibility
                aren’t met, the stored value of the component is <code>null</code>.</span>
            </td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Disabled</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">
              <p>If set to true, the user can’t
                modify the value. The default value is false.</p>
              <p style="margin-bottom:0;">This attribute accepts a resource
                with a Boolean value.</p>
            </td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Label</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">The text that appears with the screen
              component that tells the running user how to use it.</td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Provide Help</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">Give your users more context with
              this screen component. The text you enter is available in an info bubble next to the
              component.</td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Read Only</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">
              <p>If set to true, the user can’t
                modify the value, but the user can copy it. The default value is false.</p>
              <p style="margin-bottom:0;">This
                attribute accepts a resource with a Boolean value.</p>
            </td>

          </tr>
          <tr class="">
            <td data-label="Attribute" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e68 ">
              <strong class="uicontrol">Require</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e71 ">
              <span>Requires users to enter a value before
                they can move to the next screen.</span>
            </td>

          </tr>
        </tbody>
      </table>

## Set the Component Visibility

Specify the logic that determines when the flow displays the component.

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col style="width:24%">
          <col style="width:76%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e206">Option</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e209">Description</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Option" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e206 ">
              <strong class="uicontrol">When to Display Component</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e209 ">
              <p>Configure when the component is displayed by using conditional logic. </p>
              <p>You can set the components to:</p>
              <dl>

                <dt style="font-weight:bold;padding-top:.25rem;">Always</dt>

                <dd style="padding-left:1.5rem;padding-bottom:.5rem;">Always display the component.</dd>


                <dt style="font-weight:bold;padding-top:.25rem;">When all conditions are met (AND)</dt>

                <dd style="padding-left:1.5rem;padding-bottom:.5rem;">Display the component when all of the conditions that you define are met.
                  Define at least one condition.</dd>


                <dt style="font-weight:bold;padding-top:.25rem;">When any condition is met (OR)</dt>

                <dd style="padding-left:1.5rem;padding-bottom:.5rem;">Display the component when at least one of the conditions that you define is
                  met. Define at least one condition.</dd>


                <dt style="font-weight:bold;padding-top:.25rem;">When custom conditional logic is met</dt>

                <dd style="padding-left:1.5rem;padding-bottom:.5rem;">Display the component when the condition logic that you define is met.
                  Define at least one condition and specify condition logic.</dd>

              </dl>
            </td>

          </tr>
        </tbody>
      </table>

## Validate Input

Provide a formula that evaluates whether what the user entered is valid and the error message to display if invalid.

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col style="width:24%">
          <col style="width:76%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e297">Option</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e300">Description</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Option" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e297 ">
              <strong class="uicontrol">Error Message</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e300 ">Specify the error message that appears below the component if the user enters
              an invalid value.</td>

          </tr>
          <tr class="">
            <td data-label="Option" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e297 ">
              <strong class="uicontrol">Formula</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e300 ">
              <p>Provide a formula expression that returns a Boolean value.</p>
              <p>If the formula expression evaluates to <samp>true</samp>, the
                input is valid. If the formula expression evaluates to
                <samp>false</samp>, the error message appears below the
                component.
              </p>
              <p style="margin-bottom:0;">If the user leaves the field blank and the field is required, the flow shows the
                default error message and not your custom error message.</p>
            </td>

          </tr>
        </tbody>
      </table>

## Specify the Behavior of Values on Revisited Screens

Specify what this component does when a user enters a value, navigates to a previous screen, and then returns to the screen with this component.

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small ">
        <colgroup>
          <col style="width:24%">
          <col style="width:76%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e370">Option</th>
            <th scope="col" class="slds-cell-wrap" style="vertical-align:top;" id="d116429e373">Description</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="Option" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e370 ">
              <strong class="uicontrol">Use values from when the user last visited this screen</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e373 ">The component retains the values that the user specified and doesn’t update the
              values to reflect changes made on previous screens.</td>

          </tr>
          <tr class="">
            <td data-label="Option" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e370 ">
              <strong class="uicontrol">Refresh inputs to incorporate changes elsewhere in the flow</strong>
            </td>

            <td data-label="Description" class="slds-cell-wrap" style="vertical-align:top;" headers="d116429e373 ">
              <p>The component updates the user-specified values to reflect changes made on
                previous screens.</p>
              <p style="margin-bottom:0;" id="flow_ref_elements_screencmp_datetime__d3463e119"><a name="flow_ref_elements_screencmp_datetime__d3463e119"><!-- --></a>If you pause and then
                resume the flow, the flow retains user-specified values only in Checkbox, Checkbox
                Group, Currency, Long Text Area, Multi-Select Picklist, Number, Password,
                Picklist, Radio Buttons, and Text components.</p>
            </td>

          </tr>
        </tbody>
      </table>

#### See Also

- [Standard Flow Screen Components](https://help.salesforce.com/s/articleView?id=platform.flow_ref_elements_screencmp.htm&release=264.0.0&type=5 "Salesforce provides several standard screen components that extend the types of input fields available in screens.")