Extjs mouseover and click event not working together for an element id

Question

I have a button and in my controller i created one mouse over event and a click event for that button's id. But everytime when i click button it goes to the mouseover event function only, but when I comment the mouseover it goes to the click event function nicely. Why this is so? I am using ext4.1

thanks in advance.

me.control({
                '#notificationIconId':{
                        click:me.notificationClick 
                  },

                '#notificationIconId':{
                        mouseover:me.notificationMouseOver 
                  }


    });
},

notificationMouseOver : function (){
    alert('1')
},

notificationClick :function(menuitem)
{

    alert('2')
}

Answer 1

You're using two times the same key '#notificationIconId' in a Javascript object... So, the last one is overriding previous ones.

You can add multiple listeners for the same selector:

'#notificationIconId': {
    click: me.notificationClick
    ,mouseover: me.notificationMouseOver 
}