CODEWITHSUNDEEP
blazorblazor-server-side.net-8.0
Akira
Akira

Reputation: 39

Layout event handlers do not launch in a Blazor Web App application with Net8

I am implementing a custom layout for my website using Blazor Web App in .NET 8, and I am having issues getting events to be triggered from the server side.

At the time of creating the Blazor Web App project, I selected:

Interactive Render Mode: Server

Below, I show the code for the custom layout I have created. In it, I have overridden the OnAfterRenderAsync method. When debugging, I am unable to halt the execution within the method, which makes me realize that it is not being executed. This same setup works in Blazor Server projects with .NET 7.

TestLayout.razor

@inherits LayoutComponentBase
<h3>TestLayout</h3>

<h2>
    Hola como estas
</h2>
<div>
    @Body
</div>

@code {
    protected override Task OnAfterRenderAsync(bool firstRender)
    {
        return base.OnAfterRenderAsync(firstRender);
    }
}

Home.razor

@page "/"
@layout Components.Layout.TestLayout
@rendermode InteractiveServer

Hi From Home

As an additional comment and to provide context, I would like to mention that the reason I desire this behavior is because I need to associate a JavaScript file that runs after everything has been rendered. In this JS file, I have logic for events and behaviors of various DOM elements that the layout should have.

Thanks in advance

Upvotes: 2

Views: 369

Answers (1)

S M Fazaluddin
S M Fazaluddin

Reputation: 36

I also had the very same issue with my Blazor web app in .Net 8 on the server side, for some reason _imports.razor file was not reading the path to the layout so, I was able to solve it by just calling the @using directive with the path on top of the file like this,

@using WebProject.Components.Layout
@layout TestLayout

or you can do something like,

@layout WebProject.Components.Layout.TestLayout

You can read about the custom layout and how to apply them on the Microsoft documentation

Upvotes: 0

Related Questions