Event Controllers Don't Exist for Certain Components?

[grn2012]

I have everything properly set up to handle events for my main menu. For some reason, inside the init function of my controller, mouseover only works for menus, not their items. I've tried everything and I just can't seem to get it working. Are they supposed to have this event? Here is my controller code:

Ext.define('Agile.controller.Main', {
    
    extend: 'Ext.app.Controller',
    
    views: ['ui.Container'],
    
    init: function() {
        
        this.control( {
            
            'menu > menuitem': {
                
                click: this.onClick,
                
            },
            
            'syntax': {
                
                mouseover: this.onMouseOver
                
            }
        
        } );
        
    },
    
    onClick: function(objBtn, objMenu, objOptions) {
        
        console.log('click fired')
        
        strID = objBtn.id;
        
        switch (objBtn.id) {
            
            case "syntax":
                
                // Need the mouseover event to fire here to eliminate redundancy.  Syntax
                // is a child menu, just toe explain.
                
                console.log('syntax wee');
                
                break;
            
        }
        
    },
    
    onMouseOver: function(objBtn) {
        
        console.log('mouseover fired')
        console.log(objBtn)
        
        refreshViewSettings();
        
    }
    
} );

[mitchellsimoens]

If your ComponentQuery selector can return a Component then any of it's events can be listened to in your Controller. I'm assuming your click handler works as I just tested it and it worked for me. Your mouseover will not work because there is no mouseover event listed for the Ext.menu.Item.

[grn2012]

If your ComponentQuery selector can return a Component then any of it's events can be listened to in your Controller. I'm assuming your click handler works as I just tested it and it worked for me. Your mouseover will not work because there is no mouseover event listed for the Ext.menu.Item.

Is there a way to find out what item in the menu I'm hovering over or is there an event where a menu opens? I just need to know when a certain menu opens up.

[grn2012]

Is there a way to have all menus exist initially in the DOM but have their visibility set to hidden like how it is later when they're not active?