New to Telerik UI for ASP.NET MVC? Start a free 30-day trial
Creating Custom Number Editor Using NumericTextBox
Environment
| Product | Grid for Progress® Telerik® UI for UI for ASP.NET MVC |
Description
How can I create a Grid with a custom number editor by using the Telerik UI for ASP.NET MVC NumericTextBox?
Solution
-
Create an editor template within the
~\Views\Shared\EditorTemplates\directory. -
Pass the newly created view name to the following column configuration:
Razor
columns.Bound(p => p.Freight).EditorTemplateName("CustomNumericTextBox");Example
Index.cshtml
@(Html.Kendo().Grid<GridColumnEditorTemplateKB.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.OrderID).Filterable(false);
columns.Bound(p => p.Freight).Format("{0:p5}").EditorTemplateName("CustomNumericTextBox");
})
.Editable(s=>s.Mode(GridEditMode.InCell))
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Model(m=>m.Id(s=>s.OrderID))
.Read(read => read.Action("Orders_Read", "Grid"))
)
)