Questions about Angular form validation

Question

Trying to use ngMessages to do login page validation. (1) How can I make sure error messages(username and password missing) are displayed only when user click submit button? (2) How to block the submit button to prevent user from resubmitting form. Thanks

Answer 1

To display the error message after submitting the form, you should do something like this <div ng-show="theForm.login.$error.required && theForm.$submitted"></div>

And submitting only once you can do that with counter.

Here I created a working plunker.

oops, sorry didn`t pay attention to that you using ngMessages, but I hope that this will still help

Answer 2

To display the error message after submitting the form, you should do something like this

<div ng-show="form.login.$error.required && form.$submitted"></div>

To disabled the button in order to block the submit button to prevent user from resubmitting form. use ng-disabled (take a look https://docs.angularjs.org/api/ng/directive/ngDisabled), this should do something like this

<button ng-click="doSomething()" ng-disabled="submitting">

If you want to show message of form dirty, use a html and show some text in danger letter, but if you want to show another error, for example "Error, the email has been taken" you can use 'toaster' library. (http://ngmodules.org/modules/AngularJS-Toaster)