I want to use mouseover
when the button is disabled. In the below code mouseover
will work if ng-disabled="false"
but it won't work if ng-disabled="true"
.
<body ng-app="ngAnimate">
<button ng-disabled="true" ng-mouseover="show=true" ng-mouseleave="show = false">
Mouseover
</button>
<div>
Show:
<span class="test" ng-show="show">
I show up when your mouse enter on button
</span>
</div>
</body>
It's not possbile. Actually it has nothing to do with Angular. It's expected behaviour when browsers are not supposed to fire onmouseover, onclick, etc. events on disabled form controls. So you can't do it directly.
Can't do it directly - meaning, that you can bind mouseover even to wrapping container which would not have this limitation. Then you would need to control action and proceed only if disabled flag is true
or false
if you need.
That being said, you should probably not try to workaround this behaviour. Form UX perspective disabled control should not be interaction-able, after all that's what disabled means.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With