Submit in Angular form

0
votes

I am working on Angular 7 forms. I made a whole form with all fields and just added a simple button at the end of this form and now I am wondering how the click on this button is firing the submit action. I have not even set the attribute type="submit" for this button. I have 

(ngSubmit)="onSubmit(employeeForm)"

at the top of my form. Can someone make me understand how any random button is firing this submit functionality. Thanks already.

P.S. I am using Material Design controls in this form.

2
angularformseventsform-submit
If you can give us some more code (like a Minimal, Complete, and Verifiable example ), it would be a lot easier to help you. E.g. showing your exact HTML for the button would also be helpful. Thanks! – Nexonus
submit is just a form event, which can be fired using a button with type="submit" inside the form element. This functionality is simply provided by HTML, it's not Angular specific. – Tushar Walzade

2 Answers

4
votes

button in html has two types - submit and button. If you have a form and inside it a button which type is submit, clicking it will force the form to submit. So if you don't want to submit, you need to change the type of your button to button.

<button mat-button class="btn btn-primary btn-sm" type="button">Save and Next</button>
0
votes

If you have not declared button type then most browsers by default type of button is submit . Suppose you have create button like
<button name="Save">Save</button> its by default button type is submit.
so that's why you are able to fire submit event within form tag

In IE8 Standards mode, the default value is submit. In other compatibility modes and earlier versions of Windows Internet Explorer, the default value is button.