Rositsa Ruseva

Rositsa Ruseva

  • 1.4k
  • 209
  • 28.3k

Could not find 'ShowToastr' ('ShowToastr' was undefined). Blazor

Sep 14 2022 4:49 PM

I get this error: Could not find 'ShowToastr' ('ShowToastr' was undefined). I am creating a Blazor app with .NET6. This is the page:

@page "/hotel/rooms"
@inject ILocalStorageService localStorage
@inject IJSRuntime jsRuntime
@inject IHotelRoomService hotelRoomService

<h3>HotelRooms</h3>

@code {
    private HomeViewModel HomeModel { get; set; } = new HomeViewModel();
    public IEnumerable<HotelRoomDto> Rooms { get; set; } = new List<HotelRoomDto>();

    protected override async Task OnInitializedAsync()
    {
        try
        {
            if (await localStorage.GetItemAsync<HomeViewModel>(SD.Local_InitialBooking) != null)
            {
                HomeModel = await localStorage.GetItemAsync<HomeViewModel>(SD.Local_InitialBooking);
            }
            else
            {
                HomeModel.NumberOfNights = 1;
            }
            await LoadRooms();
        }
        catch (Exception ex)
        {
            await jsRuntime.ToastrError(ex.Message);
        }
    }

common.js:

window.ShowToastr = (type, message) => {
    if (type === "success") {
        toastr.success(message, "Operation Successful")
    }
    if (type === "error") {
        toastr.error(message, "Operation Failed")
    }
}

 I also have two references on ToastrError:

public static class IJSRuntimeExtension
    {
        public static async ValueTask ToastrSuccess(this IJSRuntime JSRuntime, string message)
        {
            await JSRuntime.InvokeVoidAsync("ShowToastr", "success", message);
        }

        public static async ValueTask ToastrError(this IJSRuntime JSRuntime, string message)
        {
            await JSRuntime.InvokeVoidAsync("ShowToastr", "error", message);
        }
    }

Answers (1)