Justin Lange
Justin Lange

Reputation: 907

Not able to enable a button with ng-disabled in AngularJs

This is what I have in my controller.js

$scope.fileAdded = false;

$scope.fileNameChanged = function() {
    $scope.fileAdded = true;
};

This button I want to enable ...

<a ng-disabled="!fileAdded" class="btn btn-primary" role="button">Click</a>

... when I choose a file:

<input type="file" name="file" id="file"
       onchange="angular.element(this).scope().fileNameChanged(this)">

Although fileAdded changes from false to true, the button is not enabled. Why is it still disabled?

Upvotes: 1

Views: 142

Answers (2)

Protozoid
Protozoid

Reputation: 1207

You should use Angular's ngChange directive, as opposed to the DOM onchange.

<input type="file" name="file" id="file" ng-change="fileNameChanged()">

Upvotes: -1

MrWook
MrWook

Reputation: 348

With onchange you are out of angularJS. So you need to trigger the digect cycle by yourself:

$scope.fileNameChanged = function() {
    $scope.fileAdded = true;
    $scope.$digest();
};

Upvotes: 2

Related Questions