TelerikNumericTextBox displays wrong value when being edited initially (initial zero)

Progress® Telerik® UI for Blazor Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Declined

Last Updated: 23 Feb 2022 14:58 by improwise

improwise

Created on: 11 Feb 2022 14:32

Category: UI for Blazor

Type: Bug Report

TelerikNumericTextBox displays wrong value when being edited initially (initial zero)

When you have a TelerikNumericTextBox bound to a non nullable field (like int test) it will display a 0 like this which is correct

But when you start changing the value, that initial 0 will still remain like (1234 entered)

It will however sort itself out once you leave the field

But it is still confusing to users and also makes then try to remove the initial 0.

The initial 0 should not be displayed when user has switched focus to a field and started entering text. This problem does not seem to happen if you have already entered a value and revisit the textbox.

Ideally formatting (in this case currency) should also be displayed when in Edit but that is perhaps another topic.

Thanks.

5 comments

improwise

Posted on: 23 Feb 2022 14:58

Thanks.

ADMIN

Dimo

Posted on: 23 Feb 2022 14:48

Yes, tabbing currently does not focus the numeric textbox content. I agree this can be useful and we will implement this in a future release. Currently this is the most popular NumericTextBox request and I also voted on your behalf.

In the meantime, you can consider the workaround in the linked item.

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

improwise

Posted on: 18 Feb 2022 17:27

The problem isn't the 0 in itself but rather that when you tab into the field it does not select the contents of the editor as is done for all other editors. If it did this, then anything you type into it would replace the leading zero and solve the problem.

ADMIN

Dimo

Posted on: 18 Feb 2022 10:50

Hi Patrick,

I see the reasoning behind your thoughts, but the standard Blazor InputNumber and our competitors follow the same approach. Zero is treated just like any other digit in the current value, while the user is typing.

You can remove the leading zero like this:

<p>@NumValue</p>

<TelerikNumericTextBox Value="@NumValue" ValueChanged="@( (decimal newValue) => OnValueChanged(newValue) )" />

@code {
    decimal NumValue { get; set; }

    async Task OnValueChanged(decimal newValue)
    {
        if (NumValue == 0)
        {
            await Task.Delay(1);
        }

        NumValue = newValue;
    }
}

Regards,
Dimo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

improwise

Posted on: 11 Feb 2022 14:46

Somewhat of a workaround is to change types to nullable in your DTOs, and they decorate them with Required data annotation. In this case the textbox till be rendered empty and still be required, but not an ideal solution.