Getting A Form To Submit When The Enter Key Is Pressed When There Is No Submit Button

August 20, 2024 Post a Comment

I've got a form that has no submit button and it would be great if the form is still submitted when the user hits the enter key. I've tried adding a hidden submit button, which gi

Solution 1:

Tested/cross-browser:

functionsubmitOnEnter(e) {
    var theEvent = e || window.event;
    if(theEvent.keyCode == 13) {
        this.submit;
    }
    returntrue;
}
document.getElementById("myForm").onkeypress = function(e) { returnsubmitOnEnter(e); }

<form id="myForm">
<inputtype="text"/>
...
</form>

If there is no submit button, the form will degrade miserably if javascript is not available!

Solution 2:

Using jQuery (naturally):

$("#myForm input").keyup(
    function(event){
        if(event.keycode == 13){
            $(this).closest('form').submit();
        }
    }
);

Give that a try.

Solution 3:

onKeyDown event of textbox or some control call a javascript function and add form.submit(); statement to the function.

Happy coding!!

Solution 4:

Is this what you mean?

document.myformname.submit();

Solution 5:

This will require JavaScript. The easiest way to implement this with JavaScript if you don't know the language would be to use something like jQuery (much like what inkedmn said).

<head><scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><scripttype="text/javascript"charset="utf-8">
    <!--
        $(document).ready(function() {
            $(document).keyup(function(event){
                if(event.keycode == 13){ // This checks that it was the Enter key
                    $("#myForm").submit(); // #myForm should match the form's id attribute
                }
            });
        });
    //--></script></head><body><formid="myForm">
    ...
    </form></body>

For more information on jQuery: http://docs.jquery.com/Tutorials:How_jQuery_Works#jQuery:_The_Basics

Html5 Library