Disable submit a form in html when press Enter key

Question

I have an HTML form with several text fields. So, I want to move cursor from a text field to next text field when I press the enter key, but the form should not be submitted. How can I do this? If there is a code example it may more helpful to me.

user4067659 · Accepted Answer · 2014-09-22 17:55:54Z

2

press the tab key on your keyboard instead of enter.

answered Sep 22, 2014 at 17:55

user4067659

Sign up to request clarification or add additional context in comments.

2 Comments

Brad Wells Over a year ago

This is going to be the best answer unless you have a very good reason to break tested web conventions.

Sameera Liaynage Over a year ago

yes. but i want use enter for that task. thanks your repay my friend.

Adam Sinclair · Accepted Answer · 2014-09-22 17:56:20Z

0

I'm using this function to do what you ask for:

$(document).on("keypress", ".TabOnEnter" , function(e)
  {
    if( e.keyCode ==  13 )
    {
       var nextElement = $('[tabindex="' + (this.tabIndex+1)  + '"]');
       console.log( this , nextElement ); 
       if(nextElement.length )
         nextElement.focus()
       else
         $('[tabindex="1"]').focus();  
    }   
  });

Use the 'TabOnEnte' class on the fields you want this class to apply on.

Also to prevent user from submittin with enter key:

if (e.which == 13) {
    e.preventDefault();
}

answered Sep 22, 2014 at 17:56

Adam Sinclair

1,64912 silver badges15 bronze badges

2 Comments

Sameera Liaynage Over a year ago

where should i put this second coding part?

Sameera Liaynage Over a year ago

onkeydown='if ((event.keyCode == 13 && document.getElementById("field_0").value!="") && event.which == 13) {document.getElementById("field_1").focus();event.preventDefault();}'

Josh Crozier · Accepted Answer · 2015-12-11 01:47:16Z

0

i got the answer. it should put in the input tag which we want.

onkeydown='if ((event.keyCode == 13 && document.getElementById("field_0").value!="") &&  event.which == 13){   
                document.getElementById("field_1").focus();
                event.preventDefault();
}'

edited Dec 11, 2015 at 1:47

Josh Crozier

242k56 gold badges401 silver badges316 bronze badges

answered Sep 23, 2014 at 5:02

Sameera Liaynage

8312 gold badges10 silver badges12 bronze badges

Collectives™ on Stack Overflow

Disable submit a form in html when press Enter key

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related