angular2 submit form by pressing enter without sub

Question

Is it possible to submit a form that does not have submit button (by pressing enter) example :

<form [ngFormModel]="xxx" (ngSubmit)="xxxx()">
  <input [(ngModel)]="lxxR"   ngControl="xxxxx"/>
</form

Answer 1

maybe you add keypress or keydown to the input fields and assign the event to function that will do the submit when enter is clicked

your template would look like this

<form (keydown)="keyDownFunction($event)">
  <input type="text" />
</form

And you function inside the your class would look like this

keyDownFunction(event) {
  if(event.keyCode == 13) {
    alert('you just clicked enter');
    // rest of your code
  }
}

Answer 2

I prefer (keydown.enter)="mySubmit()" because there won't be added a line break if the cursor was somewhere within a <textarea> but not at its end.

Answer 3

adding an invisible submit button does the trick

<input type="submit" style="display: none;">

Answer 4

Edit:

  <form (submit)="submit()" >
    <input />
    <button type="submit" style="display:none">hidden submit</button>
  </form>

In order to use this method, you need to have a submit button even if it's not displayed "Thanks for Toolkit's answer"

Old Answer:

Yes, exactly as you wrote it, except the event name is (submit) instead of (ngSubmit):

<form [ngFormModel]="xxx" (submit)="xxxx()">
  <input [(ngModel)]="lxxR"   ngControl="xxxxx"/>
</form>

Answer 5

You can also add (keyup.enter)="xxxx()"

Answer 6

This way is much simple...

<form [formGroup]="form" (keyup.enter)="yourMethod(form.value)">

</form>