We are using a NumericTextBox in a grid for percentage complete field. Users would like to see the % when the field is just in display mode.  The Format property of the NumericTextBox isnt showing the percent sign when it is set to p0.

@(Html.Kendo().NumericTextBoxFor(m => m)
    .Format("p0")
    .SelectOnFocus(true)
    .Decimals(0)
    .Min(0)
    .Max(100)
    .Spinners(true)
    .Events(e =>
    {
        e.Change("percentCompleteChange");
    })
}

Since the change in R2 2022, numeric text boxes now take up 100% of the width of their container, so the recommended way to set an elements width is with a DIV. However this is a block element, so how do I show a label (in a span) before the numeric text box on a single line?

Setting the div to inline, negates the width setting.

I'm using version v2023.2.606.

I currently have:-

 <p>
        <span class="lbllabel2">
            Field Namew:
        </span>
        <div style="width:150px;">
            @Html.Kendo().NumericTextBoxFor(c => c.Field)
            @Html.ValidationMessageFor(model => model.RunOrder)
        </div>

    </p>

The only way I can see to get it working is with floats, which seems excessively complicated for such a simple (and I'd assume) common scenario.

I can say that the new versions since R2 2022 have proved extremely problematic and I have yet to see an up side to the changes.

(as the title says) We updated an app including going to Kendo.Mvc (now Version 2021.2.616.545) and on one page we use Jquery to recalculate a total which is a NumericTextBoxFor. The GUI doesn't reflect, but when you click on the NumericTextBox the correct amount appears. I tried to use focus and changed event but neither seem to help.

Any ideas why this is occurring?

TIA!!

how to set NumericTextBox format dynamically like below. I tried this but its not working.

var dynamicValue = "###,###.000";

@(Html.Kendo().NumericTextBox<double>()
	.Name("Amount")
	.Spinners(false).Format("dynamicValue")
	.Decimals(3)
	.HtmlAttributes(new { style = "width: 100%; height: 27px;", tabindex = "6" })
	.Events(e => e.Change("OnAmountChange"))
)

dynamicValue is set as the response of GET API call.

Hey everyone,

I have a grid with multiple text and numeric columns. I have hidden the filter menu, which comes with an clear button.

The text columns are autocompletes, which have a clear button inside the cell.

My Problem is the numeric input elements ("k-numerictextbox") dont have a clear button inside.

I have tried around adding them later with Javascript and tried using a template, but that didnt work out and was very fragile.

Any ideas how to get that going?

Thanks 😊

Hi there. Here's my setup;

I have a grid and in the grid I bind to a column. The column has a template applied to it.

View
                    .Columns(current =>
                    {
                        current.Bound(p => p.CurrentMaterial).EditorTemplateName("ddl_Mixing_Materials_Current");
                        current.Group(g1 => g1.Title("Volumes")
                            .Columns(volume =>
                            {
                                volume.Bound(p => p.CurrentVol). EditorTemplateName("kIntegerNoSpinnerNoNegativesNamed"); <---//This one!
                                volume.Command(p => p.Custom("-20").Click("Remove20"));
                            })
                        );

Template

@model int?

@(Html.Kendo().NumericTextBoxFor(m => m)
      .Name("NumericTextBox") <-- I know this will confuse the bounding - I changed just to make next step clearer
      .HtmlAttributes(new { style = "width:100%" })
      .Decimals(0)
      .Placeholder("")
      .Min(0)
      .Max(500) <-- this is what I need to set after data binding!
      .Spinners(false)
)

So the issue is, I need to set the max of each column depending on the object bound to it. Each object has a 'maxVolume' that I want to use to set the 'max' value in the template. However - I looked at the API page and I tried to access the numberTextBox like it suggests, but the textbox is always 'undefined'. Here's the script and how I'm trying to access the NumericTextBox

Script

function dataBound(e) {
        var grid = this;
        grid.tbody.find("tr[role='row']").each(function () {
            var model = grid.dataItem(this);
            var maxValue = model.MaxVolume;
            alert(maxValue); <-- All good

            var test2 = $(this).find("#NumericTextBox");
            alert(test2); <-- Object found
            var numericTextBox2 = $('#CurrentVol').data('numerictextbox');
            alert(numericTextBox2); <-- 'Undefined'
            var numericTextBox3 = $(this).find("#NumericTextBox").data('kendoNumericTextBox');
            alert(numericTextBox3); < -- Still 'undefined'
        });
    }

So I'm clearly missing something. Is there some extra bit of traversal I need to do in my script because of the looping through grid rows I do? Am I looking for the wrong .data() type?

Any help would be great. thanks.

How can I let users paste '   123456  ' into my numeric textbox and have it auto-strip the spaces? There are spaces in the beginning and in the end too. 

currently if there is any space at the beginning or at the end, it doesn't paste anything, show some sign of exclamation and value disappears.

<kendo-numerictextbox  k-format="'#'"  ng-model="searchParams.@Model.ParameterName">
        </kendo-numerictextbox>

I also tried this where I am making dynamically kendo control as shown below:

<input kendo-numeric-text-box k-format="'#'"  ng-model="searchParams.@Model.ParameterName" />

I have tried every possible solution, 

Can you please assist how can I achieve this in Angular JS ?

Thanks, 

Umair.

Hello,

 We have a problem with a NumericTextBox within a Grid.
We would like to automatically select the text when the control NumericTextBox take focus (or only when the input value is 0).

This is defined in a NumericTextBox EditorTemplate as follows in the attached word file. I had to attach a file because of losing text formats while copy/pasting in your rich text editor in this forum (with IE10+Office2013+Win8):

Do you have an idea to make it because we are requested to do it for an intensively used and critical application ?

Thx

Mathieu P
.Net Developper
DEVOTEAM Application Practice (Luxembourg)