Bootstrap-based input controls with labels and validation messages. See also Bootstrap Forms.
<EditForm>
and can be used as standalone inputs (if you don't need the validation).
onClick
event propagation.
Input components allow you to set heights using InputSize
parameter.
InputGroupStartText, InputGroupEndText, InputGroupStartTemplate, InputGroupEndTemplate
can be used for input groups before and after the input. See Input groups in Bootstrap documentation.
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
, HxSelect
, and HxInputTags
.
Placeholder
parameter set.
Inputs inheriting from HxInputBase
support the splatting of additional attributes, specifically:
HxCheckBox
, HxSwitch
HxInputNumber
, HxInputPercent
HxInputTextBase
, HxInputText
, HxInputTextArea
HxSelectedBase
, HxSelect
Our CSS defaults bring flex-column to <form>
element (EditForm
component),
every single direct child component of <form>
is stacked vertically.
This setup implies, whenever you want to go for horizontal stacking, you have to wrap your items in some
element (usually <div>
).
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. |
ValidationMessageMode | Adjusts how are validation messages rendered. |
Enabled | Can be used to render individual component as disabled or override state from HxFormState. To set multiple components as disabled, use HxFormState . |