Form

yarn add @clayui/form

Forms obtain user data and transmit it to the system to either store the data, produce an action, or both.

Use ClayForm components for composing forms.

For controlling groups inside forms, use ClayForm.Group components like the code below:

Code Sample (expand to see it)

Validation

.has-error, .has-success and .has-warning classes are used in ClayForm.Group to identifier validation state of the form group items.

Use ClayForm.FeedbackGroup and ClayForm.FeedbackItem for creating custom feedback messages for Form Groups.

ClayForm.FeedbackIndicator is used to apply an Icon on the feedback message, like the following example:

Code Sample (expand to see it)

Use ClayForm.Text for creating a caption on Form Groups.

Code Sample (expand to see it)