CheckBox

Description

This component represents a checkbox in Blazor using the Gap.Blazor.CheckBox model. It integrates with Telerik UI components and supports dynamic styling and state management based on the model's properties.

Usage


@using Gap.Blazor
@using Gap.Blazor.Components
@using Telerik.Blazor.Components
@inherits WMControlComponentBase
@namespace Gap.Blazor.Components

@if (model.Visible)
{
    <WMStyleBase model=@checkBox></WMStyleBase>
    <div class="@model.GetStringClasses()">
        <TelerikCheckBox Id="checkBoxControl" [email protected] @bind-Value="@checkBox.Checked"/>
        <label for="checkBoxControl">@this.Text</label>
    </div>
    <style>
        [email protected](){
        }
    </style>
}

Properties

  • checkBox: Instance of the Gap.Blazor.CheckBox model.

Methods

  • OnInitialized(): Initializes the component and subscribes to the CheckedChanged and CheckStateChanged events.

Dynamic Rendering

The component dynamically renders a checkbox based on the CheckBox model properties:

  • WMStyleBase: Applies styles based on the model.

  • TelerikCheckBox: Represents the checkbox UI element.

  • Label: Displays the associated text.

Styles

The styles for the checkbox are defined within the component:

  • CSS Class: Dynamically generated using model.GetComponentClass().

  • Custom Styling: Can be extended via WMStyleBase and model-based class logic.

Events

  • CheckedChanged: Triggered when the checkbox value changes.

  • CheckStateChanged: Triggered when the check state changes (e.g., indeterminate).

Last updated