View Full Version : grid - adding new menu items to individual column header

1 Nov 2012, 2:18 AM
I am currently adding a new menu item to a grids columnheader menu:

var currentHeaders=grid.headerCt.getMenu();

text: 'new option',
menu : {
items: [
text: 'item 1', handler: function() {

this adds the new option to every column header menu - I would like to target a specific column and add the new menu option to just that one - is this possible ?

James Goddard
1 Nov 2012, 5:10 AM
All the columns use a shared menu. To achieve what you are trying to do, you'll need to override the showMenuBy function and customize the menu there.

5 Nov 2012, 3:14 AM
Ok thanks James, I will look into that

29 Mar 2013, 10:24 AM
Just figured this out this morning. Since the menu is common to all grid columns, you'll need to add all menu items that you'll need into the menu and then show/hide them based on the activeHeader property of the menu. This will allow certain menu items to display based on the column that triggered then menu to be displayed.

var mainMenu = view.headerCt.getMenu();
beforeshow: function(menu){
// If the Severity column triggered the menu, show Severity-specific menu items
if (menu.activeHeader.dataIndex == 'severity'){
for (var i=0; i<menu.items.items.length; i++){
if (menu.items.items[i].itemId == 'severityIndicatorMenuItem'){
// If any other column, hide Severity-specific menu items
} else {
for (var i=0; i<menu.items.items.length; i++){
if (menu.items.items[i].itemId == 'severityIndicatorMenuItem'){

// Add custom menu items to the default grid menu
mainMenu.insert(mainMenu.items.length-2, [{
itemId: 'toggleSortMenuItem',
text: 'Toggle Sort',
handler: function() {
mainMenu.activeHeader.sortable = (mainMenu.activeHeader.sortable) ? false : true;
itemId: 'severityIndicatorMenuItem',
text: 'Severity Indicator',
handler: function() {
// JB - Start here...

29 Mar 2013, 1:06 PM
Hi Joshua, I will try your solution - I never did find the answer so thank you!:)

29 Mar 2013, 1:18 PM
No prob! You should just have to switch the dataIndex and itemId properties in the example above to whatever you've got for it to work.