Blazor Tri-State bool with checkbox

 Blazor Tri-State Boolean with checkbox

A checkbox is a common way to represent a boolean variable. When the checkbox is checked, the variable is true. When it’s unchecked, the variable is false. Blazor includes a checkbox:

<input type="checkbox" checked="@isChecked" @oninput="CheckboxChanged">

However, in some cases, you might want more. You might want the boolean to be nullable because it is optional when you submit data to the server.

The Radzen Tri-State checkbox handles this well.

Here is a code example:

<div class="rz-p-12 rz-text-align-center">

    <RadzenCheckBox TriState=true @bind-Value=@value Name="CheckBox3" />

    <RadzenLabel Text="CheckBox" Component="CheckBox3" Style="margin-left: 8px; vertical-align: middle;" />

</div>

@code{

    bool? value;

}

This is what the UI for the three states looks like:

Note: Radzen Blazor is a free and open-source set of Blazor UI controls, usable for both WASM and Server. The Radzen Blazor component library provides a variety of components including DataGrid, Scheduler, Charts, and many others. It also offers robust theming, including Material Design and Fluent UI.

In addition to the free components, Radzen also offers a professional subscription that includes paid support and additional features like a WYSIWYG Blazor designer, automatic deployment, and access to premium themes.

Reference: 

https://blazor.radzen.com/checkbox