jQuery - Kendo UI网格 - 大量列

Question

I have a Kendo UI grid that has a large number of columns (50). Although the user will likely only select a few columns to view, he/she needs the ability to select from any of the 50 columns. Unfortunately, on most displays, the kendo grid column menu will be greater than the display. Is there a way to make the column menu scrollable or set sub-menus (that contain groups of columns) within the column menu?

Also, I found that the initial creation of the kendo Grid component is slow to build 50 columns with column menus. This is even true when initially hiding all the columns. Please let me know if also have a way to help with performance if the view issue above can be resolved. Many thanks in advance.

Answer 1

You can use CSS to reduce the height of the column menu and add a scrollbar:

.k-group .k-group
{
  height: 100px;
  overflow: auto;
}

Here is a demo: http://jsbin.com/ebenay/1/edit

Answer 2

The API allow you to Lock one or more columns with .Locked(true) on your column definition. Also, set the horizontal scroll and the capacity to turn on and off columns client side. Check this example of all this https://demos.telerik.com/aspnet-mvc/grid/frozen-columns