Class ElementReferenceExtensions

Namespace

Dmnk.Blazor.Focus

Assembly

Dmnk.Blazor.Focus.dll

Extends ElementReference with some helper methods to focus elements in a more robust way, or to focus the first/last focusable child of an element.

public static class ElementReferenceExtensions

Inheritance

object

ElementReferenceExtensions

Inherited Members

object.GetType()

object.MemberwiseClone()

object.ToString()

object.Equals(object)

object.Equals(object, object)

object.ReferenceEquals(object, object)

object.GetHashCode()

Methods

FocusFirstFocusableChild(ElementReference, IJSRuntime, CancellationToken)

Focuses the first "focusable" element child. This includes inputs, selects, buttons, inputs, etc. Elements with tabindex="-1" are filtered. See also FocusFirstFocusableChild(ElementReference, IJSRuntime, CancellationToken).

public static ValueTask FocusFirstFocusableChild(this ElementReference el, IJSRuntime js, CancellationToken ct = default)

Parameters

el ElementReference

js IJSRuntime

ct CancellationToken

Returns

ValueTask

FocusLastFocusableChild(ElementReference, IJSRuntime, CancellationToken)

Focuses the last "focusable" element child. This includes inputs, selects, buttons, inputs, etc. Elements with tabindex="-1" are filtered. See also FocusFirstFocusableChild(ElementReference, IJSRuntime, CancellationToken).

public static ValueTask FocusLastFocusableChild(this ElementReference el, IJSRuntime js, CancellationToken ct = default)

Parameters

el ElementReference

js IJSRuntime

ct CancellationToken

Returns

ValueTask

ForceFocus(ElementReference, IJSRuntime, int, CancellationToken)

Sometimes a simple FocusAsync is not enough to focus an element because there are multiple components fighting over the focus asynchronously. While that may be something that in theory should be fixed at its root, this is often rather difficult

This method fights the symptoms by simply re-focusing the element n times (with a delay of 10ms) until it is focused.

public static ValueTask ForceFocus(this ElementReference el, IJSRuntime js, int retries = 5, CancellationToken ct = default)

Parameters

el ElementReference

js IJSRuntime

retries int

ct CancellationToken

Returns

ValueTask

RestoreFocus(ElementReference, IJSRuntime, CancellationToken)

SaveFocus(ElementReference, IJSRuntime, CancellationToken)

public static ValueTask RestoreFocus(this ElementReference el, IJSRuntime js, CancellationToken ct = default)

Parameters

el ElementReference

js IJSRuntime

ct CancellationToken

Returns

ValueTask

SaveFocus(ElementReference, IJSRuntime, CancellationToken)

Store the currently focused element (document.activeElement) as a js field of the given element. You can call RestoreFocus(ElementReference, IJSRuntime, CancellationToken) to then restore focus to that element later.

public static ValueTask SaveFocus(this ElementReference el, IJSRuntime js, CancellationToken ct = default)

Parameters

el ElementReference

js IJSRuntime

ct CancellationToken

Returns

ValueTask