Search results

Close the toast with click/tap

By default, the toasts are expired based on the TimeOut value. You can customize the toast hiding process with click/tap action by setting the ToastClickEventArgs in the clicked callback function with static Toast.

The following sample demonstrates the click/tap action in toast.

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

<EjsToast @ref="ToastObj" TimeOut=0 Title="Matt sent you a friend request" Content="@ToastContent">
    <ToastPosition X="Right" Y="Bottom"></ToastPosition>
    <ToastEvents OnClick="@ToastClick"></ToastEvents>
</EjsToast>

<div class="col-lg-12 col-sm-12 col-md-12 center">
    <div style="margin: auto; text-align: center">
        <EjsButton @onclick="@ShowOnClick"> Show Toast </EjsButton>
    </div>
</div>

@code {
    EjsToast ToastObj;

    public string ToastContent { get; set;} = "You have a new friend request yet to accept";

    private void ToastClick(ToastClickEventArgs args)
    {
        args.ClickToClose = true;
    }
    private void ShowOnClick()
    {
        this.ToastObj.Show();
    }
}