Blazor Bind Event

Posted on  by admin
Specify delegate event handlers in Razor component markup with @on{DOM EVENT}="{DELEGATE}" Razor syntax:.

The {DOM EVENT} placeholder is a Document Object Model (DOM) event (for example, click). The {DELEGATE} placeholder is the C# delegate event handler. For event handling:. Asynchronous delegate event handlers that return a Task are supported. Delegate event handlers automatically trigger a UI render, so there's no need to manually call StateHasChanged. Exceptions are logged.

The following code:.

Calls the UpdateHeading method when the button is selected in the UI.

Neville Nazerane
6,205
3
In the following example, UpdateHeading:.
4

Is called asynchronously when the button is selected. Waits two seconds before updating the heading. For events that support an event argument type, specifying an event parameter in the event method definition is only necessary if the event type is used in the method.

In the following example, MouseEventArgs is used in the ReportPointerLocation method to set message text that reports the mouse coordinates when the user selects a button in the UI.

Supported EventArgs are shown in the following table. For more information, see the following resources:. Documentation links to the ASP.NET Core reference source load the repository's main branch, which represents the product unit's current development for the next release of ASP.NET Core.

To select the branch for a different release, use the Switch branches or tags dropdown list to select the branch.

Saeb AminiSaeb Amini
21.1k1

Custom events with custom event arguments are generally enabled with the following steps. In JavaScript, define a function for building the custom event argument object from the source event:. Register the custom event with the preceding handler in wwwroot/index.html (Blazor WebAssembly) or Pages/_Layout.cshtml (Blazor Server) immediately after the Blazor