theQuestions theQuestions - 25 days ago 11
AngularJS Question

ng-disabled not applying to inner span

I have the following button:

<button type="submit" ng-disabled="editForm.$invalid || vm.isSaving" class="btn btn-primary" >
<span class="glyphicon glyphicon-save"></span>&nbsp;
<span data-translate="entity.action.save" ng-click="send()">Save</span>
</button>


My issue is the
ng-disabled
is only working on the first of the inner
<span>
, so the button becomes disabled (as does the "glyphicon-save"), but the text on the button does not, and "Save" text is still clickable. Why is this happening, whats the fix?

Answer

Move your ng-click from the <span> to the <button> and you should be fine.

<button type="submit" ng-disabled="editForm.$invalid || vm.isSaving" class="btn btn-primary" ng-click="send()">
    <span class="glyphicon glyphicon-save"></span>&nbsp;
    <span data-translate="entity.action.save">Save</span>
</button>
Comments