简体   繁体   中英

Should I use Ng-submit or ng-click on a form?

I would like to know if there is a preference to using ng-click on a submit button or just having a ng-submit on a form?

My assumption is that we should use ng-submit on all forms and use ng-click on anything that isn't a form.

I know the differences that are listed below:

  • ng-submit allows the user to press enter when focused on a form where ng-click doesn't
  • ng-click can be used on any element where as ng-submit only can be applied to a form element.

I was wondering if anyone can add anything else to this list as I would like to know what the norm is in a angular project.

If we want the form not to be submitted when it is invalid, then instead of ng-click on the button, we will use ng-submit directive on the form itself

     <div class="row">
            <form name="adduser" ng-submit="AddUser(adduser.$valid)">                   
                <div id="name-group" class="form-group-lg">
                    <input type="text"
                           required
                           name="name"
                           ng-model="userfullName"
                           class="form-control"
                           placeholder="Full Name">
                </div>

In the ng-submit we calling a function AddUser from the controller with a parameter formname.$valid. This submit function will be only called when form is valid or in other words all the user input of the form is valid. Keep in mind that in this case from would not be submitted if form is not valid

When we use ng-click , form will be submitted even if it is invalid. Two observations for ng-click are as follows:

  1. We were able to submit the form even if form was not valid
  2. For the invalid inputs, the value was set to undefined in the controller

Out of experience, for mobile apps using Angular and Ionic , I used ng-click because even when the form isn't valid, the mobile keyboard arrow ( Android ) or GO ( iOS ) is enabled and will still submit it anyway. I had to use ng-click to avoid validation problems.

On web, I use ng-submit simply because, like you said, it submits on enter.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM