Prevent a button to submit on enter key

I have two buttons one with id=enterToSubmit and other with id=clickToSubmit. When a user hit the enterkey, I want "enterToSubmit" button to submit form not the "clickToSubmit" button.

开发者_开发问答

On the same page, I have a textbox id=title, and on Page Load I hide "enterToSubmit " button, until user enters something in the textbox, then users can hit Enter key to submit form.

How do preven "clickToSubmit" button to submit when users press Enter key?

---

Unfortunately you can't change the ‘default’ submit button in HTML, it's always the first input/button with type submit/image.

Whilst you can attempt to catch Enter keypress events manually it is highly unreliable to do so, since Enter isn't always supposed to submit a form, depending on (a) what type of element is focused, (b) whether shift/ctrl+enter is used, (c) what other elements are in the form and (d) what browser it is. If you miss a case you will get accidental default-submissions; if you hit a case you shouldn't, you'll get accidental enter-submissions.

So it is in general better, when you want to control the default submission action of a form, to put an extra button in as the first submit button in the form. If you don't want this button to be displayed, you can position it with a large negative left value to push it off the side of the page. (This is a bit ugly, but hiding it via display or visibility will stop it working in some browsers.)

So perhaps you could ‘hide’ the enter-to-submit button not by making it disappear but by pushing it off the page where it can't be seen, and then catching the click event on it to return false and stop the form submission.

---

How do preven "clickToSubmit" button to submit when users press Enter key?

Try this:

$("#clickToSubmit").on("keydown", function(e){
   if(e.keyCode === 13){
       e.preventDefault();
   }
});

---

    $('#formId').on('keyup keypress', function(e) {
          var keyCode = e.keyCode || e.which;
          if (keyCode === 13) { 
            e.preventDefault();
            return false;
          }
        });



Usually form is submitted on Enter when you have focus on input 
elements.
We can disable Enter key (code 13) on input elements within a form.

Also, As in some newer versions of Firefox the form submission is not prevented, it's safer to add the keypress event to the form as well.

---

    jQuery('#clickToSubmit').click(function(e){    
       if(e.keyCode==13){          
            e.preventDefault();
       }    
    });

---

First you have to make sure that both the buttons are not of type submit. Now on both this buttons you can call two different javascript functions. enterToSubmit() and clickToSubmit() also see that on enterToSubmit() you read the enter key press

if (e.keyCode === 13){ form.submit(); }

and call form.submit()

while on clickToSubmit() you do a direct form.submit()

---

Try this code for text box enter

$j("#title").keypress(function(e1){
   if(e1.keyCode==13){          // if user is hitting enter
       return false;
   }
});

for submit button

$j("#clickToSubmit").submit(function(e1){
   if(e1.keyCode==13){          // if user is hitting enter
       return false;
   }
});