Remove Spinners from NumericTextBox Editors in MVC Grid

Environment

Product Progress Kendo UI Grid for ASP.NET MVC
Progress Kendo UI version Created with the 2017.3.913 version

Description

How can I remove the spinners from the editor of a "[DataType("Integer")]" field?

Solution

  1. Under Views/Shared/EditorTemplates, add a .cshtml file with the following definition:

    NoSpinners.cshtml

    @model int?
    
    @(Html.Kendo().NumericTextBoxFor(m => m)
          .HtmlAttributes(new { style = "width:100%" })
          .Spinners(false)
    )
    
  2. Open the model that you are editing in the Grid.

  3. Add a [UIHint("NoSpinners")] annotation to the integer field which does not show spinners:

    [DisplayName("Units in stock")]
    [UIHint("NoSpinners")]
    [Range(0, int.MaxValue)]
    public int UnitsInStock
    {
        get;
        set;
    }
    
  4. Make sure that the NoSpinners string matches the name of the editor template file.

For e reference of the end result, refer to this screenshot.

See Also

In this article
Not finding the help you need? Improve this article