Do you know Blazor doesn't support stopping event propagation?

Last updated by Matthew Parker [SSW] 9 months ago.See history

Workaround - When you have two fields and you want to handle tabbing out of the last one to do some stuff and save.

  • If you handle onkeydown the value isn't set yet
  • If you handle onkeyup it triggers on the first field instead of the last one

To solve the issue change the binding to @bind:event="oninput" so the value is captured before key down.

The reason is due to the problem outlined in Keyup event behavior on tab.

There are various workarounds such as using eventPropagation in JavaScript: Catching TAB key press with keyup.

However, eventPropagation is not supported in Blazor as per this comment on Compiler support for @oneventname:preventDefault and @oneventname:stopPropagation.

So, to prevent this issue an OnInput binding lets the value be set before the keydown event is triggered.

This workaround can cause unexpected side effects if you have a custom setter so you shouldn't do that in tandem with this.

We open source. Powered by GitHub