I want to filter the Code ID's in one column, providing minimum and maximum values. I've seen a demo with dates here: Telerik Grid Filter
But I haven't been able to replicate this with a number column with Razor syntax. This is what I have so far:
@(Html.Kendo().Grid<MyViewModel>()
.Name("grdMyGrid")
.Sortable()
.Selectable(s => s.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row))
.PersistSelection()
.Events(events => events.Change("grdMyGridSelected"))
.Scrollable()
.Filterable(f => f.Mode(GridFilterMode.Row).Extra(false))
.Width("100%")
.ToolBar(x =>
{
x.Search();
})
.Columns(columns =>
{
columns.Bound(column => column.Code)
.Title("Code").HeaderHtmlAttributes(new { @class = "font-weight-bold" })
.Filterable(filterable => filterable.UI("betweenFilter"));
columns.Bound(column => column.Description).Title("Title").HeaderHtmlAttributes(new {@class = "font-weight-bold"});
columns.Bound(column => column.Category).Title("Category").HeaderHtmlAttributes(new {@class = "font-weight-bold"});
})
.DataSource(ds => ds.Ajax()
.ServerOperation(false)
.Read(r => r.Action("DocumentItem", "Admin", new {handler = "ReadList" })
.Data("gridAdditionalData")
.Type(HttpVerbs.Get))
.Model(model => { model.Id(p => p.Code); })
.PageSize(25)
)
.NoRecords(true)
.Pageable(
pager => pager.AlwaysVisible(true)
.PageSizes(new[] {10, 25, 50, 100}))
.Resizable(resize => resize.Columns(true))
)What I want is two input fields the user can provide the min and max values. The JavaScript code creates some HTML to inject here, but it's not happening. Any help would be very much appreciated.