ExtJS : How to disable browser context menu

This is a quick solution to disabling browser default context menu when right-clicking in ExtJS.


Ext.getBody().on("contextmenu", Ext.emptyFn, null, {preventDefault: true});  


Basically, you can implement a TreePanel or other ExtJS components like:

new Ext.tree.TreePanel({
        listeners: {
               render: function() {
                       // After the component has been rendered, disable the default browser context menu
                       Ext.getBody().on("contextmenu", Ext.emptyFn, null, {preventDefault: true});
               }, 
               contextmenu: function(e) {
                       // Init your context menu
               }
        }
});

Tested working on FF 3.6, Chrome 3, Safari 4 and IE7. Opera 10 unfortunately fails.

, ,