Version v3 Documentation
You are viewing documentation for an older version.
View latest (v4) documentation →
Form Field Input OTP
A pre-composed form field that wraps a BbInputOTP 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.
Default
A basic
FormFieldInputOTP with a label, helper text, and two-way binding via @bind-Value. The component renders 6 input boxes in groups of 3 by default with a separator between groups.
Loading example…
Masked PIN
Set
MaskInput to true to mask the input for security-sensitive fields like PINs. Use Length and GroupSize to configure a 4-digit layout with no separator.
Loading example…
Alphanumeric
Set
InputMode to InputOTPInputMode.LettersAndNumbers to accept both letters and digits. This is useful for license keys or alphanumeric verification codes.
Loading example…
Disabled
Set
Disabled to true to prevent user interaction. The input boxes and label display with reduced opacity.
Loading example…
EditForm Validation
Inside an
EditForm, validation errors from DataAnnotationsValidator display automatically. Try submitting without entering the full code.
Loading example…