Telerik Forums
UI for Blazor Forum
1 answer
11 views

I just updated our .NET 8 Blazor webapp from Telerik 5.0.1 to 5.1.1. Now, interacting with any input in a form applies validation classes to all other inputs in the form.  I hope this behavior is unintentional as it could lead to user confusion. I believe this was introduced in the 5.0.1 update which was supposed to fix the issue of validation classes being present on initial render. I could find no other documentation or discussion regarding this.

This behavior can be seen in the Form - Validation demo...

Blazor Form Demos - Validation | Telerik UI for Blazor

Type valid input in the Graduate Grade field and all other fields turn green even though they don't have valid input...

Clicking Submit to show that those fields are not valid.

Hristian Stefanov
Telerik team
 answered on 25 Mar 2024
2 answers
18 views

Hy,

In my application I had to insert the localization with the default Italian language.

I followed the points explained in this link step by step: Blazor Localization - Telerik UI for Blazor

Inside my application I therefore have a Resources folder with the following files inside:
TelerikMessages.resx and TelerikMessages.it-IT.resx (set as default on Program.cs).

My problem is the following: in debug the localization for the DateTimePicker or NumericTextBox components works correctly showing me the date and number formats in Italian with the related translated texts.

However, once I insert my application into a docker container, the localization seems to have no effect, showing both components in English language and format.

My Resources Folder:

However, localization for the Grid component works correctly in both cases.

Attached is the behavior of the date picker in debug mode and inside a docker container.

Can anyone give me a solution without using the Format property of the components but using localization? My application is in Dotnet 8

Thanks.

Marco
Top achievements
Rank 2
Iron
Iron
Iron
 answered on 11 Mar 2024
1 answer
18 views

We modified the code in the InCell Editing demo (Blazor Components Demos and Examples - Telerik UI for Blazor) with the Telerik REPL tool to include an EditorTemplate for the UnitPrice column. If we type in the column quickly and press tab to exit the field the input is cutoff.  ie; we type 155 and the value shown in the grid after the update is 15.  We have recorded a video showing the problem but we are unable to upload here.  

In our own sample application that we built to isolate the problem we saw the same behavior with TelerikTextBoxes and TelerikNumericTextBoxes.

Is this a known problem with a known solution? 

The code used for the EditorTemplate

        <GridColumn Field=@nameof(ProductDto.UnitPriceDisplayFormat="{0:C}" Title="Unit Price" Width="150px" >

            <EditorTemplate>
            @{
            var item = context as ProductDto;
            if (item != null)
            {
                <TelerikNumericTextBox @bind-Value="@item.UnitPrice"/>
            }
            }
            </EditorTemplate>
        </GridColumn>
Hristian Stefanov
Telerik team
 answered on 05 Feb 2024
1 answer
36 views

The custom format optin in NumericTextBox is pretty useful, but I could not see any clear documentation. It links to the dotnet format guide, but also works with #s?

E.g. missing 0s i logged this (and then answered it myself) NumericTextBox with a format field does not display the digit '0' in UI for Blazor | Telerik Forums

"# unit(s)" works, but "there is # unit(s)" does not

Apologies if there is such a documentation and i missed it!

Dimo
Telerik team
 answered on 13 Nov 2023
1 answer
43 views

I'd like to check if its possible to have the format of a NumericTextBox display when the user has focus (i.e. they are typing something in). 

Currently it just shows a blank input (which makes sense), but if we could prepend it with a format or something that would be useful.

 

For example, adding the $ sign at the start. It's not a huge issue but keen to see if it's possible.

Dimo
Telerik team
 answered on 13 Nov 2023
1 answer
32 views

When I make a format of $AUD#, or #,#, or even # it works for anything that is not 0.

This also occurs in the demo formats in Blazor Numeric Textbox Overview - Telerik UI for Blazor

I assume it's as designed, but is there any way to force the display of 0?

Chris
Top achievements
Rank 1
Iron
 answered on 09 Nov 2023
1 answer
41 views

When I create a form with auto-generated fields and disable one of them (see code), the field indeed cannot be edited, but the associated spinner remains active (is a numeric field in this case), allowing the modification of the field's value. I believe that the underlying editor of the field (regardless of its type: datepicker, combobox, dropdownlist, numerictextbox or colorpicker) should be disabled when the FormItem is disabled, as it creates inconsistencies in the UI.

<FormItems>
              <FormItem Field="@nameof(ViewModel.SomeField)" />
              <FormItem Field="@nameof(ViewModel.NumericField)" Enabled="@some_variable"/>
</FormItems>
I understand that I could specify the template and disable the editor within it, but in this case, it would be necessary to define the templates of almost every FormItem, and the auto-generated editors would lose their purpose. 

Regards. 
Twain.


1 answer
46 views

Summary

When tabbing into an input, normally the text of the input is selected, allowing immediate entry of new text. However, when the NumericTextbox has a different display format than the edit format, the input text is selected briefly and then the selection is lost when the format is changed (for example, a dollar sign is removed from a currency format). This prevents text from being entered without further action from the user, such as manually selecting the text or moving the cursor. This may also impact WCAG 2.0 AA compliance.

Steps to Reproduce

  1. Navigate to https://demos.telerik.com/blazor-ui/numerictextbox/formats
  2. Give the General Number Format input the focus.
  3. Press Tab to give the focus to the Currency Format input.

Expected Results

The Currency Format text should be selected and numeric text should be accepted.

Actual Results

The Currency Format text is not selected and the cursor is to the right of the text. If you try to enter a number, nothing will happen. To be able to enter text, the text must manually be selected or the cursor must be moved first.

Notes

You can see the expected behaviour by doing the following:

  1. Navigate to https://demos.telerik.com/blazor-ui/numerictextbox/formats
  2. Give the Currency Format input the focus.
  3. Press the Tab + Shift to give the focus to the General Number Format input.

The General Number Format input text will now be selected and data entry works as expected. The correct behaviour can also be observed on the Telerik Form demo page: https://demos.telerik.com/blazor-ui/form/overview

Hristian Stefanov
Telerik team
 answered on 26 Sep 2023
0 answers
172 views
I've run into an issue and searched results have yielded a little, but not quite enough information. My project is in blazor server. I am using telerik form components and fluent validation. Is there a global way to prevent the inputs from submitting as you type? I can use the ValidateOn parameter which is fine but when using a <FormItem> component without a <Template> there is no way to do such. Also, i would like the textboxes and other inputs to not bind at all until onblur to prevent excess server calls. In those instances, i can work around it using the DebounceDelay parameter of the textbox but that seems the wrong approach. Finally, with the debounce delay, is it executed on the server or client? Meaning, if i use the DebounceDelay approach is a c# Timer still running and the component still communicating with the server as you type? Thank you in advance for any help or feedback!
Alex
Top achievements
Rank 1
 asked on 25 Sep 2023
1 answer
71 views

Hi, 

I would like to stop the incrementing of my NumericTextBox when I use the keyboard arrows. I use preventDefault, but it doesn't work.

<div @onkeydown:preventDefault="true">
     <TelerikNumericTextBox Id="test" Width="95%" Decimals="2" Format="C2" @bind-Value="@Test" Arrows="false"> 
     </TelerikNumericTextBox>
</div>

Can anyone help me?

Thanks!

Zachary
Top achievements
Rank 1
Iron
 updated answer on 06 Sep 2023
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?