Native Events in Blazor RadioButton Component

3 Apr 20231 minute to read

You can define the native event using on event attribute in component. The value of attribute is treated as an event handler. The event specific data will be available in event arguments.

The different event argument types for each event are,

• Focus Events - UIFocusEventArgs
• Mouse Events - UIMouseEventArgs
• Keyboard Events - UIKeyboardEventArgs
• Touch Events - UITouchEventArgs

List of Native events supported

The following native event support have been provided to the Radio Button component:

List of Native events
onchange	oninput	onblur	onfocus	onfocusout
onfocusin	onclick	onkeydown	onkeyup	onkeypress

How to bind onchange event to Radio Button

The onchange attribute is used to bind the onchange event for Radio Button. Here, we have explained about the sample code snippets of Radio Button.

@using Syncfusion.Blazor.Buttons

<SfRadioButton Label="Credit/Debit Card" Name="payment" Value="credit/debit" TChecked="string" @onchange="onChange" @bind-Checked="stringChecked"></SfRadioButton>
<br />
<SfRadioButton Label="Net Banking" Name="payment" Value="netbanking" TChecked="string" @onchange="onChange" @bind-Checked="stringChecked"></SfRadioButton>

@code {
    private string stringChecked = "netbanking";
    private void onChange(Microsoft.AspNetCore.Components.ChangeEventArgs args)
    {
       //onChange Event triggered
    }
}