Form Field Checkbox
A pre-composed form field that wraps a Checkbox control with automatic label, helper text, and error message display. Inherits from FormFieldBase, which provides EditContext integration, auto-generated control IDs, ARIA attribute wiring, and validation error state management. The default orientation is HorizontalEnd (label appears after the checkbox).
Default
A basic
FormFieldCheckbox with a label and two-way binding via @bind-Checked. The component automatically generates a unique ID to associate the label with the checkbox for accessibility.Accepted: False
With Helper Text
Use the
HelperText parameter to display guidance below the checkbox. The helper text automatically hides when the field enters an error state, replaced by the error message.Receive updates about new features and promotions.
With Error
Use
ErrorText to manually set a validation error. Click Validate to trigger the error when the checkbox is unchecked, or check the box to clear it.Indeterminate
A parent checkbox that shows an indeterminate dash when only some children are checked. Clicking the parent toggles all children on or off.
Disabled
Set
Disabled to true to prevent user interaction. The checkbox and label display with reduced opacity.Upgrade your plan to enable this feature.
Horizontal Layout
Set
Orientation to FieldOrientation.Horizontal to place the label beside the checkbox. This is useful for compact form layouts where vertical space is limited.Keep me signed in on this device.
Custom Variant
Use
InputClass to apply custom Tailwind CSS classes to the inner checkbox and Class to style the outer field container. This lets you create branded checkbox styles with custom colors and borders.EditForm Validation
Inside an
EditForm, validation errors from DataAnnotationsValidator display automatically. Try submitting without accepting the terms.