Navigating pages in Blazor

Question

SO i want to navigate from one page to another. From a list of products to a edit product view. On my list page i have a link as follows.

<NavLink class="nav-link">
                        <span class="oi oi-list-rich" aria-hidden="true" id="@product.Id" @onclick="@(() => Navigate(product.Id))" style="cursor: pointer"></span> Edit @*FIX ME should link to edit product. Obviously...*@
</NavLink>

And the code is to navigate is:

    void Navigate(long productId)
    {
        NavManager.NavigateTo("/editproduct/" + productId);
    }

and i want to get to a page: @page "/editproduct/{id}"

In my opinion my code should work. Yet im getting a: Uncaught Error: System.ArgumentException: There is no event handler associated with this event.

when i click on my link. Any ideas how to fix this ?

Answer 1

I don't believe that the problem is the navigation itself. Try the navigation from two other pages (create page1 and page2) and give it a try. If it works properly, the problem is elsewhere in your code.

I would give this response as a comment, but like Caveman, I don't have enough reputation.

Answer 2

Take a look at a NavLink in NavMenu.razor

<NavLink class="nav-link" href="counter">
     <span class="oi oi-plus" aria-hidden="true"></span> Counter
</NavLink>

Note the href pointing to where you want to navigate to.

<NavLink class="nav-link" href="@($"editproduct/{product.Id}")">