Kendo Grid resizing column does not show resize handle of their header cells

Viewed 848

I have the following kendo grid in ASP.NET Core. The grid is using BindTo method to bind grid to model

@(Html.Kendo().Grid<AccountGridModel>()
        .Name("MyGrid")                        
        .Columns(col =>
        {
            col.Bound(p => p.AccountID).ClientTemplate("<input type=\"radio\" name=\"mt-acct\" class=\"mt-act\" />").Width(30).Title(" ");
            col.Bound(p => p.AccountNumber).ClientTemplate("<a href=\"#= ExternalAccountLink #\" target=\"_blank\">#= AccountNumber #</a>").Width(250).Title("Account Number");         
            col.Bound(p => p.AccountType).Width(200).Title("Account Type");     
            col.Bound(p => p.AccountDescription).Width(200).Title("Account Description");
        })
        .AutoBind(true)
        .BindTo(Model.Accounts)
        .Pageable()
        .Sortable(sortable => sortable
            .AllowUnsort(true)
            .SortMode(GridSortMode.MultipleColumn))
        .Resizable(resize => resize.Columns(true))
 )

I have set width on all columns and enabled Resizing. Idea is once it is set the users can resize columns by dragging the edges (resize handles) of their header cells.

ISSUE
1> When grid renders i cannot see resize handle when i hove over the column edges.
2> How do i set PageSize? Grid is not using Ajax. In Ajax Call we can set pagesize like .DataSource(ds => ds.Ajax().PageSize(50)) How do i use the default page size here

1 Answers

For issue 1 - not seeing the resize handle, do you have the kendo CSS styles included (either in your layout or this page)?

For issue 2: Even though you're binding to local data, you can still set the PageSize on the DataSource (just set ServerOperation to false), see the code below from the example here.

.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .ServerOperation(false))
Related