ToggleButton Events
This article explains the events available in the Telerik ToggleButton for Blazor:
SelectedChanged
The SelectedChanged
fires when the user changes the state of the button by clicking it (or by using Space
or Enter
). You can use it to call local view-model logic. To fetch data or perform async operations, use the OnClick event.
Handle the SelectedChanged event
@* If you do not update the view-model in the handler, you can effectively cancel the event *@
<TelerikToggleButton Selected="@IsSelected" SelectedChanged="@MySelectedChangedHandler">
Selected: @IsSelected
</TelerikToggleButton>
@code {
bool IsSelected { get; set; }
void MySelectedChangedHandler(bool currSelectedState)
{
IsSelected = currSelectedState;
//you have to update the model manually because handling the SelectedChanged event does not let you use @bind-Selected
Console.WriteLine($"Current state is {IsSelected}");
}
}
OnClick
The OnClick
event fires when the user clicks or taps the button. You can use it to invoke async logic such as fetching data or calling a service.
It receives argument of type MouseEventArgs.
Handle the Toggle Button OnClick event
@result
<br />
@moreInfo
<br />
<TelerikToggleButton @bind-Selected="@IsSelected" OnClick="@ToggleButtonClickHandler">
Selected: <strong>@IsSelected</strong>
</TelerikToggleButton>
@code {
bool IsSelected { get; set; } = true;
string result { get; set; }
string moreInfo { get; set; }
async Task ToggleButtonClickHandler(MouseEventArgs args)
{
await Task.Delay(500); // simulate a service call
string currState = IsSelected ? "ON" : "OFF";
result = $"The user clicked the {currState} state.";
moreInfo = "The user pressed Ctrl: " + args.CtrlKey;
}
}
The event is an
EventCallback
and it can be synchronous (returnvoid
), or it can also be asynchronous and returnasync Task
.