angulaire de validation - prévenir bouton ng-click() lorsque le formulaire est invalide
J'ai une forme angulaire dans le cadre d'une seule page de l'App. Le bouton "Continuer" se déplace d'un utilisateur à la section suivante de l'application, et a un ng-click. Je voudrais éviter ce ng-click de se produire lorsque le bouton est cliqué et que le formulaire n'est pas valide, mais je ne veux pas désactiver le bouton Continuer.
Exemple: Un utilisateur arrive sur la page et immédiatement clique sur le bouton Continuer sans fournir un prénom. Le message d'erreur "Vous devez donner un prénom" est affichée et l'utilisateur reste sur la page.
Comment puis-je faire cela? Voici le code:
<form name="form" novalidate >
<div ng-show="form.FirstName.$touched && form.FirstName.$error.required" class="errorMessage">
You must enter a first name
</div>
<div class="form-group">
<label for="firstName" class="form-label">First Name</label>
<input id="firstName" class="form-control" name="FirstName" ng-model="vm.user.firstName" required />
</div>
<div class="btn-group">
<button ng-click="vm.next()">Continue</button>
</div>
</form>
- Qu'est-ce que votre contrôleur de code?
- Double Possible de AngularJS vérifier si le formulaire est valide dans le contrôleur
Vous devez vous connecter pour publier un commentaire.
Juste ajouter
form.$valid &&
avant l'appel de la fonction:ng-show="tried && form.FirstName.$touched && form.FirstName.$error.required"
+ng-click="tried = true; form.$valid && vm.next()"
Un bouton est désactivé ou qu'il est cliquable, vous ne pouvez pas avoir les deux.
Ce que vous pourriez faire dans votre contrôleur pour les vm.next() dire:
vm.form.$invalid
.