Arter
Arter

Reputation: 187

ng-disable not working for hide submit button

Hi I have a problem with ng-disabled for my submit button. Here is my code:

<div class="container">
<form class="form-login" role="form" name="form">
  <h2 class="form-login-heading">Sign up</h2>
  <br />
  <input type="text" class="form-control" placeholder="Username" name="username" data-ng-model="registration.username" ng-minlength="5" ng-maxlength="20" ng-pattern="/^[A-z][A-z0-9]*$/" required />
  <span ng-show="form.username.$error.required && form.username.$dirty">required</span>
  <br />

  <input type="password" id="password" class="form-control" placeholder="Password" name="password" data-ng-model="registration.plainPassword" ng-minlength="8" ng-maxlength="20" ng-pattern="/(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z])/" required />
  <span ng-show="form.password.$error.required && form.password.$dirty">required</span>
  <br />

  <input type="password" id="password_c" class="form-control" placeholder="Confirm password" name="password_c" data-ng-model="registration.password_c" valid-password-c required />
  <br />

  <input type="email" id="email" class="form-control" placeholder="email" name="email" data-ng-model="registration.email" required>
  <span ng-show="form.email.$error.required && form.email.$dirty">required</span>
  <br />

  <button class="btn btn-lg btn-info btn-block" type="submit" ng-disabled="form.$invalid" data-ng-click="signUp()">Submit</button>
  <div data-ng-hide="message == ''" data-ng-class="(savedSuccessfully) ? 'alert alert-success' : 'alert alert-danger'">
    {{message}}
  </div>
</form>

I tried ng-disabled="!form.$valid" but the code is still not working. Console doesn't show any error. Can someone help me? Thank you

Upvotes: 2

Views: 437

Answers (2)

Arter
Arter

Reputation: 187

we solve the problem, thnx to @Silvinus, he save my life and time The problem was in my directive, for password confirmation. I forget add return. This is how it looks

.directive('validPasswordC', function () {
return {
    require: 'ngModel',
    link: function (scope, elm, attrs, ctrl) {
        ctrl.$parsers.unshift(function (viewValue, $scope) {
            var noMatch = viewValue != scope.form.password.$viewValue
            ctrl.$setValidity('noMatch', !noMatch);
            return viewValue;    //this is what i forget to add
        });
    }
};
});

Upvotes: 1

Milo Shen
Milo Shen

Reputation: 56

I copied your code and it working for me. Maybe the directive 'valid-password-c' if wrong.

Upvotes: 0

Related Questions