RadzenTextBoz @bind-Value int error

Radzen Studio Blazor Server
1

Hi,

I have a RadzenTextBox whose @bind-value is an int value and the problem is:

  • If I leave the int value, the error is: "Cannot implicitly convert type 'int?' in 'string' "

  • If the .ToString () value is added to the int value, the errors are:

  1. "Lambda expression cannot be converted to the delegated type indicated because some of the returned types of the block cannot be implicitly converted into the return type of the delegate "
  2. "The left part of an assignment must be a variable, a property or an indexer"

Could you help me?

Thank you very much in advance.

2

Hi @at_extchj232,

RadzenTextBox works only with string properties (similar to the Blazor built-in InputText). You can use RadzenNumeric for integers or other numeric properties.

3

Perfect, thank you @korchev!

4

How to remove all of the arrows up down from Radzen numeric. I cannot have those in the app, but apparently now cannot use RadzenTextBox.

5

You can use custom CSS:

.ui-spinner-button {
  display: none;
}
6

How would i add the custom CCS ?

<RadzenNumeric @bind-Value="SetCode01" ReadOnly="true" Style="margin-left: 5px; width: 50px" />

7

You want to add custom CSS class? You can do this using class attribute.

8

What I did is use the RadzenNumeric element, and to remove the arrows:

::deep :is(.rz-spinner-down .rz-spinner-up) {
display: none;
}

9

There is a property for that:

10

@enchev :

I find that RadzenNumeric doesn't "style" like RadzenTextBox;
How can i get RadzenNumeric to look like RadzenTextBox?

image

<div class="row">
      <RadzenText Style="width:100px;margin-top:8px;"><b>Text</b></RadzenText>
      <RadzenTextBox  @bind-Value=@textValue
                                  Disabled=@(!editing) Style="width:250px;height:48px" />
</div>
<div class="row">
       <RadzenText Style="width:100px;margin-top:8px;"><b>Style</b></RadzenText>
       <RadzenDropDown Data=@lvStyles TextProperty=@nameof(LookupValue.Name)
                            Disabled=@(!editing)
                            ValueProperty="ID" AllowClear=true
                            Placeholder="Select Deck Style"
                            Style="width: 100%; max-width: 250px; height:3rem;"
                            Name="ddStyle"
                            @bind-Value="SelectedDeck.StyleID" />
</div>

<div class="row">
       <RadzenText Style="width:100px;margin-top:8px;"><b>Numeric</b></RadzenText>
       <RadzenNumeric @bind-Value=@SelectedDeck.SourceID ShowUpDown="false" TValue="int?"  
                     Disabled=@(!editing) Style="max-width:250px;height:48px;width:100%;" />
</div>
'''
11

Not sure which theme you are using however here is how both components look in our demos using Material3:

image
image1920×1080 139 KB

image
image1920×1080 134 KB

12

In the basic Blazor app, I see the same thing as you - text box and numeric are styled the same way.

I'm using Radzen in Oqtane, so instead of using the component, I include the theme via css - using material3 or material3-base I get the styled result for the TextBox, but the Numeric doesnt respond to style changes.

Not sure the best way to include the theme in Oqtane besides providing the theme via css. I've tried adding to my page and get the same unstyled result on the Numeric.

Please offer any thoughts on what I can try to include the theme properly?

Or perhaps some other way to style / override the look of the Numeric?

Besides binding to a number, and providing the Scroll wheels, does the numeric have some other wrapper that the TextBox lacks?

13

You probably have an old version of the material 3 theme. Follow these instructions how to get the latest one from Radzen Blazor Studio.

14

This did the trick. Thank You.