---
title: Form components
description: >-
  Reference for form component types, element options, validation rules, and
  conditional fields.
breadcrumbs: Docs > Actions > Forms > Form components
---

# Form components

{% callout %}
# Important note for users on the following Datadog sites: app.ddog-gov.com, us2.ddog-gov.com

{% alert level="danger" %}
This product is not supported for your selected [Datadog site](https://docs.datadoghq.com/getting_started/site.md). ({% placeholder "user-datadog-site-name" /%}).
{% /alert %}

{% /callout %}

## Overview{% #overview %}

Forms are made up of components, which are individual question or input blocks. Each component has a set of configurable elements and optional validation rules. You can also set conditional logic on individual fields to show or hide them based on a respondent's previous answers.

## Component types{% #component-types %}

When building a form, click **Add Component** to get started. The following component types are available:

| Component     | Description                                                                                     |
| ------------- | ----------------------------------------------------------------------------------------------- |
| Short answer  | A single-line text input.                                                                       |
| Paragraph     | A multi-line text input.                                                                        |
| Number input  | A numeric input field.                                                                          |
| Dropdown      | A list of options where the respondent selects one. Supports static options or dynamic options. |
| Radio buttons | A list of options where the respondent selects one.                                             |
| Checkboxes    | A list of options where the respondent can select multiple.                                     |
| Rating        | A set of rating questions.                                                                      |
| Toggle        | A boolean on/off switch.                                                                        |
| Ranking       | A ranked ordering of a list of options.                                                         |
| Date picker   | A calendar date selector.                                                                       |
| Image         | An image embedded in the form for context or instructions.                                      |

## Component elements{% #component-elements %}

Each component has a set of configurable elements in the component editor:

| Element           | Description                                                                                                                                                  |
| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Add a description | An optional description displayed below the component question.                                                                                              |
| Required          | Toggle to determine whether the question requires an answer. Required questions are marked with a red asterisk.                                              |
| Advanced          | Configure the placeholder text and default value for the component.                                                                                          |
| Rules             | Configure validation rules to restrict the values respondents can submit. See Validation rules.                                                              |
| Conditions        | Configure conditional logic to show or hide the component based on a respondent's previous answers. See Conditional fields.                                  |
| Style             | Change the component type while preserving its existing options. For example, switch a dropdown to checkboxes without removing and recreating the component. |

## Validation rules{% #validation-rules %}

You can configure validation rules on individual components to restrict the values respondents can submit.

For short answer and paragraph components, you can set a minimum and maximum character length, or restrict input to a specific pattern: email, URL, alphanumeric, or a custom regex.

For number input components, you can set a minimum and maximum value.

## Conditional fields{% #conditional-fields %}

Conditional fields let you show or hide a question based on a respondent's answer to a previous question. For example, you can show a follow-up question only when a respondent selects a specific option from a dropdown.

To configure a conditional field:

1. Click a component to open its editor panel.
1. Click Conditions.
1. Click Add Condition and define the rule.
1. Click Save.

You can also view conditions in the Fields panel by clicking the 
{% icon name="icon-source-control-branch-wui" /%}
 branch icon.

## Dynamic dropdown options{% #dynamic-dropdown-options %}

Dropdown components can fetch options dynamically from Datadog tag values at runtime. Dynamic options update automatically as your tag values change, without requiring manual edits to the form.

To configure dynamic options:

1. Click a dropdown component to open its editor panel.
1. Click Advanced.
1. Under Options source, select Dynamic.
1. Select the tag key to use as the source of options.
1. Optionally, configure substring filtering or cross-tag scope constraints.
1. Click Save.

## JSON editor{% #json-editor %}

In addition to the visual component editor, you can edit the underlying JSON Schema of the form directly. In the Fields panel, click the 
{% icon name="icon-dev-code" /%}
 code icon to open the JSON code editor.

## Further reading{% #further-reading %}

- [Forms](https://docs.datadoghq.com/actions/forms.md)