# Inquiries: Date form component

> Add the Date component to an Inquiry screen to capture dates by month, day, and year, with a fixed or relative allowed date range.

Source: https://help.withpersona.com/articles/1TPl6AZw8vK8Zt1ACVfqyG/
Section: Inquiries > Features > Screen Components

## What is the Inquiry Date form component?

**Date** is an Inquiry form component that adds a set of fields to the screen where users can enter a date by month, day, and year.

![datecomponent_screenshot](https://assets.withpersona.com/f_auto,q_auto/help-center/articles/inquiries/dateform.png '1216x240')

The **Date** form component is useful for capturing birthdates, expiration dates, ID issue dates, and scheduling information.

## How do you add an Inquiry Date form component?

1.  Navigate to the Dashboard, and click on **Inquiries > Templates**.
2.  Find and click on the Inquiry template you want to edit, or **Create** a new template.
3.  Hover over a screen and click the **Pencil** icon, or double-click the screen to open it in the Screen Editing View.

    ![component-edit](https://assets.withpersona.com/f_auto,q_auto/help-center/articles/inquiries/component-edit.png '740x298')

4.  In the Left Panel, search the Component Library for ‘**Date**’.
5.  Drag and drop the Date form component into your screen, and reposition it by dragging it around.
6.  Click on the Date form component to open its settings in the Right Panel. The panel has three tabs: **Design**, **Data**, and **Logic**.
    1.  On the **Design** tab, under **Properties**:
        1.  **Label**: Set the label shown above the field. The **Label** is a text element displayed above the Date component to describe its purpose, such as “Date of birth,” helping users understand what information to provide.
        2.  **Label Month**, **Label Day**, and **Label Year**: Set the label shown above each part of the date.
        3.  **Placeholder Month**, **Placeholder Day**, and **Placeholder Year**: Set the placeholder text shown inside each part of the date, offering an example or guidance on the expected format until the user enters their own input.
        4.  **Tooltip Text**: Set the tooltip text that gives users more context.
    2.  On the **Design** tab, use the **Layout**, **Typography**, and **Appearance** sections to style the component. See the Design tab section on the [Screen Step components in Inquiries](https://help.withpersona.com/articles/6bdXdAJjp5OE93u7L6AgNT/) page for details.
    3.  On the **Data** tab, choose the field the input is written to, and set the **Timezone** the date is displayed in. You can also customize the field’s behavior, such as whether it is required, and set the allowed **Date range**. To learn more about configuring the date range, see **Customizing Date ranges** section below. Add custom validation rules to control when the entry is considered valid. See the Data tab section on the [Screen Step components in Inquiries](https://help.withpersona.com/articles/6bdXdAJjp5OE93u7L6AgNT/) page for details.
    4.  On the **Logic** tab, add rules that govern when the component appears, and when it does not. See the Logic tab section on the [Screen Step components in Inquiries](https://help.withpersona.com/articles/6bdXdAJjp5OE93u7L6AgNT/) page for details.
7.  Use the actions at the top right of the panel to copy, delete, or set translations on the component. To translate the text, see [Editing translations for your Inquiry](https://help.withpersona.com/articles/1vMFCXQxDsdpZ2YI4eguFd/).
8.  **Close** the step. You’ll have to **Save** and **Publish** the template to begin using it.

## Customizing Date ranges

The **Date range** setting lets you define which dates users can select from. Setting a date range means users can only choose valid dates based on your criteria, which improves accuracy and the user experience. If you set an invalid date range, you will see a warning.

Click **Select date range** to open the Date range window, then choose one of two types: **Fixed** or **Relative**.

## Fixed range

A fixed range sets specific calendar dates for the start and end, limiting users to dates within that exact period (for example, January 1, 2025 to December 31, 2025). This is ideal for events, application deadlines, or scenarios that require strict date selection.

## Relative range

A relative range sets the range relative to the current date, using **Today** or **Custom**. Custom lets you adjust the range dynamically so it moves forward or backward in time (for example, 30 days from today or 1 year before today). This works well for scheduling appointments, setting expiration dates, or creating rolling date windows.

## Plans Explained

### Date form component by plan

|                     | Startup Program | Essential Plan | Growth Plan | Enterprise Plan |
| ------------------- | --------------- | -------------- | ----------- | --------------- |
| Date form component | Available       | Available      | Available   | Available       |

[Learn more about pricing and plans](https://withpersona.com/pricing?utm_source=product&utm_medium=referral&utm_audience=a&utm_campaign=cm_gen_ds_hc-plan-table).