HTML form - when I hit enter it refreshes page!

Question

Is there a way to make a form NOT refresh or call anything when you hit "Enter" key on your keyboard?

Thank you so much!!!

I found this code for preventing Enter from working, but it DOESN'T work in IE :(

  $(document).ready(function() {
  $(window).keydown(function(event){
    if(event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
  });
}

score 41 · Accepted Answer · answered Feb 07 '10 at 01:07

41

Try this:

$(function() {
    $("form").submit(function() { return false; });
});

answered Feb 07 '10 at 01:07

icktoofay

126,289
21
250
231

2

a non-jquery answer to this would be nice since jquery is so outdated – John Miller May 07 '22 at 21:57
1

@JohnMiller try something like onSubmit={(e) => handleLogin(e)} and inside handleLogin function define this: e.preventDefault(); – Pedro Cunha Mar 22 '23 at 23:55

score 25 · Answer 2 · answered Feb 07 '10 at 02:04

Disabling the submit event isn't a good idea. Now you can never submit the form by pressing the button where it is for.

Rather hook on the keypress event:

<form onkeypress="return event.keyCode != 13">

or in jQuery flavor:

$('form').keypress(function(event) { 
    return event.keyCode != 13;
});

13 is the keyCode of Enter key. This works in all browsers from IE6 up to with all the current ones. You only have to take textareas into account. You may then consider this construct instead:

$(':input:not(textarea)').keypress(function(event) { 
    return event.keyCode != 13;
});

score 21 · Answer 3 · answered Feb 07 '10 at 02:23

21

add onSubmit property on form's tag.

<form onSubmit="return false;">

answered Feb 07 '10 at 02:23

PatlaDJ

1,226
2
17
31

1

the simplest and best solution, imo – Bellarmine Head Mar 02 '17 at 14:50

score 2 · Answer 4 · answered Mar 01 '14 at 15:01

You can prevent form submission by 'enter' key natively if you are using AngularJS.

According to HTML specification and AngularJS, you need to check this list:

Form must have NO action=... attribute (AngularJS handles it automatically)
Form must have NO button with type="submit" attribute

So, if you have no action attribute and submit button, then your form should not be submitted by hitting enter key.

Also, cross-browser keyCode is this:

var code = (e.keyCode ? e.keyCode : e.which);

I know this wasn't an AngularJS question but this worked a treat for me (using AngularJS). — Dave O'Brien, Feb 04 '16 at 12:38

HTML form - when I hit enter it refreshes page!

4 Answers4