Skip to content

Latest commit

 

History

History
61 lines (46 loc) · 1.71 KB

grid-remove-spinner-numerictextbox-editor.md

File metadata and controls

61 lines (46 loc) · 1.71 KB
title description type page_title slug tags ticketid res_type component
Remove Spinners from NumericTextBox Editors in the Grid
An example on how to remove the side arrows of the NumericTextBox editor in the Telerik UI Grid for ASP.NET Core.
how-to
Remove Spinner Arrows of the NumericTextBox Editor | Telerik UI for ASP.NET Core Grid
grid-remove-spinner-numerictextbox-editor
numerictextbox, spinners, editor, remove
1132419, 1134869
kb
numerictextbox

Environment

Product Grid for Progress® Telerik® UI for ASP.NET Core
Product Version 2017.3.913

Description

How can I remove the spinners from the editor of a "[DataType("Integer")]" field in the Telerik UI Grid for ASP.NET Core?

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.

To see the end result, refer to this screenshot.

See Also