PDA

View Full Version : Overriding EnableColumnHide in Ext JS 3.3.1



hailey
6 Jun 2011, 4:35 PM
I am trying to override EnableColumnHide property in Ext JS 3.3.1 (from EditorGridPanel) so that it behaves the same way as it is in Ext JS 4.0: in Ext JS 4.0, if the user choose the column to be hidden with the menu opened, then the menu also gets hidden along the column (for instance, if the menu was opened at column A and the user unchecked column A, then the menu disappears with the column). However, in Ext JS 3.3.1, the menu remains open in this case. Therefore, I want to add a case to allow the menu to disappear when the user choose to hide the column with the menu open. I was trying to create a new menu with addMenuItem, but then I am not sure how to proceed at this point.

skirtle
6 Jun 2011, 9:40 PM
new Ext.grid.GridPanel({
...,
view: new Ext.grid.GridView({
handleHdMenuClickDefault: function(item) {
// Call the original implementation to do the show/hide of the column
Ext.grid.GridView.prototype.handleHdMenuClickDefault.apply(this, arguments);

// Taken from Ext.grid.GridView.handleHdMenuClickDefault
var colModel = this.cm,
itemId = item.getItemId(),
index = colModel.getIndexById(itemId.substr(4));

// Only hide the menu if it was shown for the same column we are hiding
if (this.hdCtxIndex === index) {
this.hmenu.hide();
}
}
})
});

hailey
7 Jun 2011, 11:08 AM
new Ext.grid.GridPanel({
...,
view: new Ext.grid.GridView({
handleHdMenuClickDefault: function(item) {
// Call the original implementation to do the show/hide of the column
Ext.grid.GridView.prototype.handleHdMenuClickDefault.apply(this, arguments);

// Taken from Ext.grid.GridView.handleHdMenuClickDefault
var colModel = this.cm,
itemId = item.getItemId(),
index = colModel.getIndexById(itemId.substr(4));

// Only hide the menu if it was shown for the same column we are hiding
if (this.hdCtxIndex === index) {
this.hmenu.hide();
}
}
})
});

Thanks, it worked :)