Ant Design Blazor
Checkbox
Checkbox component.
When To Use
- Used for selecting multiple values from several options.
- If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.
Examples
Basic usage of checkbox.
Communicated with other components.
Render checkboxs by specific enum type.
We can use Checkbox and Grid in Checkbox.Group, to implement complex layout.
Disabled checkbox.
Generate a group of checkboxes from an array.
The indeterminate property can help you to achieve a 'check all' effect.
CheckboxGroup can be used in mixed mode, when both Options and ChildContent can be used. Set MixedMode parameter to select which section should be rendered first.
Checkbox API#
| Property | Description | Type | Default Value |
|---|---|---|---|
| ChildContent | ParameterContent to display next to checkbox | RenderFragment | -- |
| CheckedChange | ParameterCallback executed when checked state changesInstead use @bind-Checked or EventCallback Obsolete Will be removed in a future version. |
EventCallback<Boolean> | -- |
| CheckedExpression | ParameterCurrently not implemented Obsolete Will be removed in a future version. |
Expression<Func<Boolean>> | -- |
| Indeterminate | ParameterIndeterminate checked state of checkbox | Boolean | -- |
| Label | ParameterLabel for checkbox | String | -- |
| AutoFocus | ParameterWhether to autofocus on the input or not | Boolean | false |
| Checked | ParameterIf the input is checked or not | Boolean | false |
| OnChange | ParameterCallback executed when the input changes | EventCallback<Boolean> | -- |
| CheckedChanged | ParameterGets or sets a callback that updates the bound checked value. | EventCallback<Boolean> | -- |
| Disabled | ParameterDisable the input | Boolean | false |
| ValidationMessages | Validation messages for the FormItem | String[] | -- |
| AdditionalAttributes | ParameterGets or sets a collection of additional attributes that will be applied to the created element. | IReadOnlyDictionary<String, Object> | -- |
| Value | ParameterGets or sets the value of the input. This should be used with two-way binding. | Boolean | -- |
| ValueChanged | ParameterCallback that updates the bound value. | EventCallback<Boolean> | -- |
| ValueExpression | ParameterAn expression that identifies the bound value. | Expression<Func<Boolean>> | -- |
| ValuesExpression | ParameterAn expression that identifies the enumerable of bound values. | Expression<Func<IEnumerable<Boolean>>> | -- |
| Size | ParameterThe size of the input box. Note: in the context of a form, the `large` size is used. Available: `large` `default` `small` | String | AntSizeLDSType.Default |
| CultureInfo | ParameterWhat Culture will be used when converting string to value and value to string Useful for InputNumber component. | CultureInfo | CultureInfo.CurrentCulture |
| Id | ParameterID for the component's HTML | String | Uniquely Generated ID |
| Class | ParameterSpecifies one or more class names for an DOM element. | String | -- |
| Style | ParameterSpecifies an inline style for a DOM element. | String | -- |
| RefBack | ParameterA ForwardRef instance. You can get a reference to the internal DOM by using AntDesign.ForwardRef.Current. |
ForwardRef | -- |