This is a migrated thread and some comments may be shown as answers.

Show Column Menu Only in Certain Columns

4 Answers 579 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Hatton Point
Top achievements
Rank 1
Hatton Point asked on 03 Jan 2013, 08:29 PM
In a Grid. How best would I hide the column menu for certain columns? I have a few column headers that align to the right. The arrow appears behind the text and makes it difficult to read the Column Title. I would simply like to hide the Column Menu for these columns.

I am not referring to hiding them from appearing in the Column Menu itself.

In the below screenshot, I want to see the column menu on Company but not on Sum of Qty or Sum of Order.

http://goo.gl/DFQC7

4 Answers, 1 is accepted

Sort by
0
Accepted
Nikolay Rusev
Telerik team
answered on 04 Jan 2013, 07:34 AM
Hello Hatton,

Once the Grid is created you can remove the handler for the column menu.
//remove column menu handler for `bar` column
grid.thead.find("[data-field=bar]>.k-header-column-menu").remove();

Here is a full example: http://jsbin.com/idiroc/1

Regards,
Nikolay Rusev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Hatton Point
Top achievements
Rank 1
answered on 04 Jan 2013, 05:46 PM
Excellent. As I am using MVC, the grid was already defined. I only needed the last part of the jsbin.

My complete code (inside script tags following the MVC grid):

$(function () {
    var grid = $("#bsbBookTypeGrid").data("kendoGrid");
    grid.thead.find("[data-field=Quantity]>.k-header-column-menu").remove();
    grid.thead.find("[data-field=OrderDollars]>.k-header-column-menu").remove();
    grid.thead.find("[data-field=Month]>.k-header-column-menu").remove();
    grid.thead.find("[data-field=MonthName]>.k-header-column-menu").remove();
    grid.thead.find("[data-field=Year]>.k-header-column-menu").remove();
});

Note for other. The last three columns are hidden on load, but will appear in the ColumnMenu drop down and visibility can be set to on. The script still executes against those hidden columns and removes the ColumnMenu.
0
Rowell
Top achievements
Rank 1
answered on 04 Aug 2014, 03:12 PM
Hi Nikolay,

I'm trying to do the same thing but in the child grid column. I have grid with hierarchy, I want to remove the columnMenu of one column in the child grid.

I will be thankful if you can sahre some code on this.


0
Nikolay Rusev
Telerik team
answered on 05 Aug 2014, 07:57 AM
Hello Rowell,

The approach is the same - right after grid initialization (in your case detail grid) remove the column menu handler. 

The specific implementation depends on how you are initializing detail grid.

Regards,
Nikolay Rusev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Hatton Point
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
Hatton Point
Top achievements
Rank 1
Rowell
Top achievements
Rank 1
Share this question
or