Search results

Getting Started

This section briefly explains how to include a Toast component in your Blazor client-side application. You can refer to the Getting Started with Syncfusion Blazor for Client-Side in Visual Studio 2019 Preview page for the introduction and configuring the common specifications.

Importing Syncfusion Blazor component in the application

  • Install Syncfusion.EJ2.Blazor NuGet package to the application by using the NuGet Package Manager. Please ensure to check the Include prerelease option.
  • You can add the client-side resources through CDN or local npm package to the <head> element of the ~/wwwroot/index.html page.
    <environment include="Development">
        <link href="" rel="stylesheet" />
        <script src=""></script>

Initialize the ASP.NET Core Blazor Toast component

Initialize the Essential JS 2 Toast component in any web page (razor) in the Pages folder. For example, the Toast component is added in the ~/Pages/Index.razor page.

The following code explains how to initialize a simple Toast in ASP.NET Razor page.

@using Syncfusion.EJ2.Blazor
@using Syncfusion.EJ2.Blazor.Notifications
@using Syncfusion.EJ2.Blazor.Buttons

<EjsToast @ref="ToastObj" Title="Adaptive Tiles Meeting" TimeOut=5000 Icon="e-meeting" Content="@ToastContent">
    <ToastPosition X="Right"></ToastPosition>
<div class="col-lg-12 col-sm-12 col-md-12 center">
    <div id="toastBtnDefault" style="margin: auto;text-align: center">
        <EjsButton Content="Show Toasts" @onclick="@ShowOnClick"></EjsButton>
        <EjsButton Content="Hide All" @onclick="@HideOnClick"></EjsButton>

    #toast_default .e-meeting::before {
        content: "\e705";
        font-size: 17px;

@code {
    EjsToast ToastObj;

    public string ToastContent { get; set;} = "Conference Room 01 / Building 135 10:00 AM-10:30 AM";
    private void ShowOnClick()
    private void HideOnClick()


Run the application

After successful compilation of your application, run the application.

The output will be as follows.

Toast Sample

See Also