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
2 Answers
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
2 Comments
vincentf
Thanks for your answer and example. Can I just ask another question, if I don't use button to submit the form, instead, I'll use a tag <a> which is outside of <form>, can I still implement the validation above? how should I do it? Thanks
Saidbek Arislonov
You can definitely use
<a> tag instead of button, but you can't pass ng-disabled parameter to <a> tag, and talking about having the submit button outside of form is also possible, I would say take a look at this answerTo 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)
ngMessages? Can you also post some code samples?