Form Inputs

Bootstrap-based input fields with labels and validation messages. See also Bootstrap Forms.

Basic inputs

Hint: Enter text, value is shared with all text inputs.

Input groups

InputGroupStartText, InputGroupEndText, InputGroupStartTemplate, InputGroupEndTemplate can be used for input groups before and after the input. See Input groups in Bootstrap documentation.

.00

Floating labels

Create beautifully simple form labels that float over your input fields. See Bootstrap 5 documentation on Floating labels.
They are supported by HxInputText, HxInputTextArea, HxInputNumber, HxInputDate, HxAutosuggest, and HxInputTags.

Splatting of additional attributes

Inputs inheriting from HxInputBase support the splatting of additional attributes, specifically:

  • HxInputCheckBox, HxInputSwitch
  • HxInputNumber, HxInputPercent
  • HxInputTextBase, HxInputText, HxInputTextArea
  • HxSelectedBase, HxSelect

API

Common component properties

Name Description
Value, ValueChanged Value of the input.
Label, LabelTemplate Label to be next to the input. Label is rendered before the input.
Hint, HintTemplate Hint to be next to the input. Label is rendered after the input and validation message.
InputCssClass CSS class to be set to the input.
ShowValidationMessage Can be used to suppress rendering of a validation message.
Enabled Can be used to render individual component as disabled or override state from HxFormState. To set multiple components as disabled, use HxFormState.
An unhandled error has occurred. Reload 🗙