Disable form submission via Enter key on only _some fields

JqueryWebforms

Jquery Problem Overview

I want to retain the conventional 'form submits when i press Enter' behavior because users are familiar with. But by reflex, they often hit enter when they finish with a text input box - but before they are actually done with the complete form.

I'd like to hijack the Enter key only when then focus is on a certain class of input.

Looking Related Questions this looks like what I'm looking for:

if (document.addEventListener) {
    document.getElementById('strip').addEventListener('keypress',HandleKeyPress,false);
} else {
    document.getElementById('strip').onkeypress = HandleKeyPress;
}

but the if (document.addEventListener) { part is unfamiliar to me.

Jquery Solutions

Solution 1 - Jquery

You can capture and cancel the enter keypress on those fields like this:

$('.noEnterSubmit').keypress(function(e){
    if ( e.which == 13 ) return false;
    //or...
    if ( e.which == 13 ) e.preventDefault();
});

Then on your inputs just give them a class="noEnterSubmit" :)

Looking ahead in case others find this later, in jQuery 1.4.3 (not out yet) you can shorten it to this:

$('.noEnterSubmit').bind('keypress', false);

Solution 2 - Jquery

 <input type="text"  onkeydown="return (event.keyCode!=13);" />

Solution 3 - Jquery

Just add following code in <Head> Tag in your HTML Code. It will Form submission on Enter Key For all fields on form

<script type="text/javascript">
    function stopEnterKey(evt) {
        var evt = (evt) ? evt : ((event) ? event : null);
        var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
        if ((evt.keyCode == 13) && (node.type == "text")) { return false; }
    }
    document.onkeypress = stopEnterKey;
</script>

Solution 4 - Jquery

To allow enter only on a specific class (in this example, 'enterSubmit'):

jQuery(document).ready(function(){
    jQuery('input').keypress(function(event){
        var enterOkClass =  jQuery(this).attr('class');
        if (event.which == 13 && enterOkClass != 'enterSubmit') {
            event.preventDefault();
            return false;   
        }
    });
});
Categories
Recommended Jquery Solutions
Recommended Webforms Solutions

Previous Solution:

What is the Regular Expression For "Not Whitespace and Not a hyphen"

Regex

Next Solution:

Can Stopwatch be used in production code?

C#Timersystem.diagnosticsStopwatch

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionjustSteveView Question on Stackoverflow
Solution 1 - JqueryNick CraverView Answer on Stackoverflow
Solution 2 - JquerystackuserView Answer on Stackoverflow
Solution 3 - JqueryKailas ManeView Answer on Stackoverflow
Solution 4 - JquerySilas PalmerView Answer on Stackoverflow