6

Question:

Is there a way on Blazor to cancel navigation?

Let's supose a siple a href like this:

<a href="/some/other/blazor/spa/page">Go</a>

I would like to cancel navigation (for example if we are editing a form)

What I have tried.

Via JS

I set onbeforeunload dom delegate via JSInterop:

window.onbeforeunload = function(){
        return 'Vols abandonar aquesta pàgina?';
      };

but blazor bypass it.

Via locationchanged

I tried unsuccessfully to intercept navigation on locationchanged event:

@implements IDisposable
@inject NavigationManager NavigationManager

...

protected override void OnInitialized()
{
    NavigationManager.LocationChanged += HandleLocationChanged;
}

private void HandleLocationChanged(object sender, LocationChangedEventArgs e)
{
    // Cancel Navigation Here
}

public void Dispose()
{
    NavigationManager.LocationChanged -= HandleLocationChanged;
}
Ogglas
  • 50,115
  • 30
  • 272
  • 333
dani herrera
  • 44,444
  • 7
  • 103
  • 165

3 Answers3

4

Currently no, this feature is being discussed for .NET V5 - and has a community contribution pull-request so hopefully will make it in. https://github.com/dotnet/aspnetcore/pull/24417

The page is not changed when you navigate in Blazor, so there is no unload in order to trigger onbeforeunload.

Peter Morris
  • 16,193
  • 8
  • 71
  • 124
1

Update to @PeterMorris answer.

As of 2021-05-17 a location changing event for NavigationManger is now committed for .NET 6.0. I hope it will be possible to catch this event on a global level in the application.

enter image description here

https://github.com/dotnet/aspnetcore/issues/14962

Ogglas
  • 50,115
  • 30
  • 272
  • 333
-1

have you tried to put your js file in the index.html or _host.cshtml page ?

raphadesa
  • 211
  • 3
  • 10