Class SfCheckBox<TChecked>

Represents a configurable CheckBox component which allows the user to select, deselect, or display an indeterminate state. This component supports checked, unchecked, and indeterminate states, and can be used in forms or as a standalone UI input to collect binary or triple-state responses.

Inheritance
System.Object
SfBaseComponent
SfInputBase<TChecked>
SfCheckBox<TChecked>
Inherited Members
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.CheckedChanged
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.CheckedExpression
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.ChildContent
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.HtmlAttributes
Namespace: Syncfusion.Blazor.Buttons
Assembly: Syncfusion.Blazor.dll
Syntax
public class SfCheckBox<TChecked> : SfInputBase<TChecked>
Type Parameters
Name
TChecked
Remarks

The SfCheckBox<TChecked> component supports checked, unchecked, and indeterminate states. It provides support for two-state and tristate selection patterns with flexible property configuration, including custom label positioning, enable/disable tri-state, RTL support, and accessibility options. The checkbox state can be two or three states based on the EnableTriState property and is intended for both standalone use and within forms.

Examples

The following example demonstrates how to instantiate a basic checkbox that is initially checked.

<SfCheckBox Checked="true">
</SfCheckBox>

Constructors

SfCheckBox()

Declaration
public SfCheckBox()

Properties

EnableTriState

Gets or sets a value indicating whether the checkbox supports tristate (checked, unchecked, and indeterminate).

Declaration
public bool EnableTriState { get; set; }
Property Value
Type Description
System.Boolean

true if the tristate mode is enabled. The default value is false.
Remarks

If enabled, the checkbox can display three states: checked, unchecked, and indeterminate. This state depends on the combination of the Checked and Indeterminate properties. Tristate mode is useful for representing partial selections, such as in select-all scenarios.

Examples
<SfCheckBox EnableTriState="true">
</SfCheckBox>

Indeterminate

Gets or sets a value that specifies whether the checkbox is in the indeterminate state.

Declaration
public bool Indeterminate { get; set; }
Property Value
Type Description
System.Boolean

true if the checkbox state is indeterminate; otherwise, false. The default value is false.
Remarks

Setting Indeterminate places the checkbox in the indeterminate state, which overrides the Checked property during the initial render. Use this state when the selection is partial or undefined.

Examples
<SfCheckBox Indeterminate="true">
</SfCheckBox>

Label

Gets or sets the label text that is displayed next to the checkbox.

Declaration
public string Label { get; set; }
Property Value
Type Description
System.String

A string representing the label content for the checkbox. The default value is String.Empty.
Remarks

This property specifies the descriptive text shown beside the checkbox element. Assign a value to visually describe the purpose of the checkbox to users.

Examples
<SfCheckBox Label="Accept Terms">
</SfCheckBox>

LabelPosition

Gets or sets a value that determines the placement of the label in relation to the checkbox.

Declaration
public LabelPosition LabelPosition { get; set; }
Property Value
Type Description
LabelPosition

One of the LabelPosition enumeration values which can be Before or After. The default value is Before.
Remarks

If set to Before, the label appears to the left side of the checkbox; if set to After, the label appears to the right side. Use this property to customize the layout and improve accessibility.

Examples
<SfCheckBox Label="I agree" LabelPosition="LabelPosition.After">
</SfCheckBox>

ValueChange

Gets or sets an event callback that is invoked when the checked, unchecked, or indeterminate state of the checkbox changes due to a UI interaction.

Declaration
public EventCallback<ChangeEventArgs<TChecked>> ValueChange { get; set; }
Property Value
Type Description
Microsoft.AspNetCore.Components.EventCallback<ChangeEventArgs<TChecked>>

An EventCallback<ChangeEventArgs<TChecked>> that is triggered whenever the state of the checkbox is altered by the user. The callback argument contains the updated checked state and the UI event.
Remarks

This event is only raised from UI-based interactions (such as mouse/touch clicks), and not from programmatic changes. Handle this event to react to state changes for form submission, validation, or other logic.

Examples
<SfCheckBox ValueChange="@Changed">
</SfCheckBox>
@code {
    private void Changed(ChangeEventArgs<bool> args)
    {
        // Handle checkbox value change.
    }
}

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Parameters
Type Name Description
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder __builder

InitRender(Boolean)

Declaration
protected override void InitRender(bool isDynamic = false)
Parameters
Type Name Description
System.Boolean isDynamic
Overrides
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.InitRender(System.Boolean)

OnAfterRenderAsync(Boolean)

Declaration
protected override Task OnAfterRenderAsync(bool firstRender)
Parameters
Type Name Description
System.Boolean firstRender
Returns
Type
System.Threading.Tasks.Task
Overrides
Syncfusion.Blazor.Buttons.SfInputBase<TChecked>.OnAfterRenderAsync(System.Boolean)