Set input attributes for RadzenNumeric component

I would like to set the client-side onfocus event of a RadzenNumeric.

With RadzenTextBox, we can do this easily:

<RadzenTextBox @bind-Value=@value onfocus="dosomething()" />

But doing the same will fail with a RadzenNumeric:

<RadzenNumeric @bind-Value=@value onfocus="dosomething()" />

This is because onfocus is set on the enclosing <span> tag, rather than <input>, as is the case with RadzenTextBox.

Is there a way to get this functionality with the RadzenNumeric? If there is none, I would be happy to implement a fix for this.

You can try using @onfocusenter instead of @onfocus.

Thanks @korchev - while @onfocusenter didn't work for me, your suggestion led me to try something that did the trick:

<RadzenNumeric id="numeric"
              ...
               @onfocusin="OnFocus" />
        private void OnFocus()
        {
            jsRuntime.InvokeVoidAsync("eval", $@"document.getElementById(""numeric"").firstElementChild.select()");
        }

In this way, I was able to call select() on the input tag of a RadzenNumeric.

Yeah, I meant @onfocusin. Not sure where this @onfocusenter came from :slight_smile:

1 Like