Menu
There is a span tag with glyphicon icon that I want to disable.But ng-disabled is not working, that is the icon is still clickable.
<span ng-disabled="true" class="glyphicon glyphicon-trash" style="font-size:13px;" aria-hidden="true" ng-click="DeleteIpAdress(objIpAdress)" ng-show="objIpAdress.ShowRemoveButton" ng-model="objIpAdress.ShowRemoveButton" title="Delete IP address"></span>
Is anything wrong in the tag?
282
This answer could be extended to work globally by simply using css: span[disabled] { pointer-events: none; } . This way you don't need to worry about resetting pointer-events to auto. Or you could use a class like . clicks-disabled { pointer-events: none } .
Definition and UsageThe ng-disabled directive sets the disabled attribute of a form field (input, select, or textarea). The form field will be disabled if the expression inside the ng-disabled attribute returns true. The ng-disabled directive is necessary to be able to shift the value between true and false .
Or you can use ng-disabled="condition1 || condition2" , is depend of you logic conditional.
The ng-disabled Directive in AngularJS is used to enable or disable the HTML elements. If the expression inside the ng-disabled attribute returns true then the form field will be disabled or vice versa. It is usually applied on the form field (i.e, input, select, button, etc).
ng-disabled directive works only with input fields and buttons. It does not work with span. Ref: ngDisabled Documentation
You can prevent click action using following code
ng-click="isClickAllowed && DeleteIpAdress(objIpAdress)"
ng-disabled doesn't work on span.So I disabled the click
ng-click="disabledConditionHere || DeleteIpAdress(objIpAdress)"
and then changed the style of span by using class
.disable-span{
color: #E6E6E6;
cursor: not-allowed;
}
and used class in span tag
class="disable-span"
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