Prevent Enter key from submitting Phoenix form

I was wondering if there was some way to prevent the Enter key from submitting a Phoenix form. I would like the Enter key to be used for another event. Thank you!

3 Likes
3 Likes

Just don’t add a <button> with the type submit. Keep in mind that the default type of a <button> is submit. Define it explicitly as <button type="button">

3 Likes

Thanks! For those that want to know you can just add this line as an option to Phoenix’s form_for :

<%= f = form_for @changeset, "#",
  id: "survey-form",
  phx_target: @myself,
  phx_change: "validate",
  phx_submit: "save",
  onkeydown: "return event.key != 'Enter';"%>  # add this line

This will prevent the enter key from submitting the form.

8 Likes