Jump to content

Form Block: How do I prevent the enter key from submitting a form prematurely?

Recommended Posts

Here's my form: Bio Form

I'm having problems with customers hitting enter expecting to move within the cell, but enter submits the form before they've completed it.

How can I prevent the return key from submitting the form but still allow it to be used normally inside of a field?

I've tried the following code, which works for now to stop the form from being submitted, but seems to disable the use of the enter key altogether (I don't want that):


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

Thanks in advance for your help!

Link to comment
  • 4 weeks later...
  • Replies 4
  • Views 15.3k
  • Created
  • Last Reply

One thing to try would be to detect that return keystroke (enter key) and turn it into a tab keystroke. Check this and see if it helps, Converting an enter key press into a tab key press.

Then if you want the enter key to work when the submit button has focus, check in your “enter to tab” code and see if the submit button has focus. Something like this may work:


var submitFocus = false;

$('input :submit').focus(function() {
 submitFocus = true;
});

$(window).keydown(function(event) {
   if (event.keyCode == 13 && submitFocus == false) {
       window.event.keyCode = 9;
   }
});

I haven’t tested this code and it may need some tweaking, but hopefully it points you in the right direction.Best wishes!"TJ"

I have experience in programming websites and social networks.

Link to comment

Just to clarify – you want the enter key to start a newline in the two textareas, Athletic Awards and Academic Honors/ Recognitions?

Right now if I hit the enter key in those fields, nothing happens. I’m thinking Squarespace have some code interfering with the usual operations of the form.

The name is an Anglicised form of the Greek Korvetti — I like to think there’s a little bit of the ancient Hellenic drive in me.

Link to comment

Archived

This topic is now archived and is closed to further replies.


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.