I have a Kendo UI grid (using MVC) created with the snippet here.
@(Html.Kendo().Grid<EntityResultTypeWhichDoesntMatter>().Name("searchresults")
.Events(events => events.DataBound("onDataBound"))
.Pageable()
.Scrollable(s => s.Height("auto"))
.Sortable()
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Driver_Read", "Driver").Data("getSearchCriteria"))
.PageSize(10)
).Columns(s =>
{
s.Bound(p => p.HiddenIdField).Visible(false);
s.Bound(p => p.FirstName).Title("First Name").Width(150);
s.Bound(p => p.LastName).Title("Last Name").Width(150);
s.Bound(p => p.EmployeeNumber).Title("Employee Number").Width(170);
s.Bound(p => p.ExtraField1).Title("Extra Field1").Width(180);
s.Bound(p => p.ExtraField2).Title("Extra Field2").Width(170);
s.Command(command => command.Custom(Edit).Click("edit")).Width(80).Visible(Model.CanEdit);
}).Filterable().Resizable(e=>e.Columns(true)))
As you can see, the columns are specified with explicit "width" properties and also the grid is "Resizable" too.
The issue that I'm facing is that when dragging the mouse to resize the grid, it shows like the below one
the blue box in the middle of the first column heading represents the position of the mouse pointer while dragging. It's kind of an odd experience as the resize is not running along with the mouse position. I saw this solution but it didn't seem to work for me. Any idea? Thanks.
