Skip to main content
🏠FormForm CaptionVersion: 2.0.0-beta.5

Form Caption

QtmFormCaption element is a message (hint, error message, counter value, etc) that appears below the inputs.

This is some placeholder help text
<QtmFormCaption>This is some placeholder help text</QtmFormCaption>

Sizes

Control the size of a form caption setting size attribute to small, medium or large value. By default, the caption has size="medium".

This is some placeholder help text

This is some placeholder help text

This is some placeholder help text

<QtmFormCaption size="small">This is some placeholder help text</QtmFormCaption>
<QtmFormCaption size="medium"
>This is some placeholder help text</QtmFormCaption
>
<QtmFormCaption size="large">This is some placeholder help text</QtmFormCaption>

Disabled

Add disabled attribute in form caption to disable the element.

This is some placeholder help text
<QtmFormCaption disabled>This is some placeholder help text</QtmFormCaption>

Validation states

Error

Add state="error" in caption to changer its color in error state.

The field is required
<QtmFormCaption state="error">The field is required</QtmFormCaption>

Warning

Add state="warning" in caption to changer its color in warning state.

Enter a valid input
<QtmFormCaption state="warning">Enter a valid input</QtmFormCaption>

API

QtmFormCaption

PropertyTypeDefaultDescription
classesstringlist of classes to override or extend the styles applied to the component. You can use available utility classes by importing
disabledbooleanfalseIf true, the component is disabled.
size"large" | "medium" | "small"'medium'The size of element
state"error" | "success" | "warning"