How to remove addClsOnOver listener ExtJS

Question

When a button is clicked, I use addClsOnOver to change the over cls of the button and it works fine. The second time the button is clicked, addClsOnOver is called again but with a different class and this is expected to happen multiple times but unfortunately, the event listeners created by addClsOnOver are not over-written after the first click. I know now that I need to use removeListener() and then addClsOnOver if I want to change it again after the first time but dont know what parameters to put in it to remove the addClsOnOver listener. I'm sure its fairly simple but I'm out of guesses atm and cant find anything in the docs that might suggest what the auto-generated listener might be called.

Help please? :)

Answer 1

If you do not set fn parameter in removeListener() method, all listeners for specified event will be removed.

So if you do not use your own listeners for mouseenter and mouseleave on button element you can use for removing listeners seted by addClsOnOver() method this code:

// use el.dom as scope because it is used el.hover method when listeners were created
el.removeListener('mouseenter', null, el.dom);
el.removeListener('mouseleave', null, el.dom);

Fiddle with example: https://fiddle.sencha.com/#fiddle/30d