Question

I would like to show a div when the enter key or submit(/button) is used.
I tried:

$("#inputfield").submit( function () {
$("#div").show();
});

It doesn’t work and I don’t understand why. I googled for this but I didn’t find a proper solution. Help would be appreciated.

Answer 1

I’m sure all your input fields are wrapped inside of a form tag. Pressing enter, or submitting a form via the submit button doesnt trigger the submit event on the input that had focus when you pressed enter, or on the submit button, but rather on the form element. So you need to check for the submit event on your form element.

Also, showing a div on form submit wont be much help because the default action is to then redirect, so you need to prevent the default action by doing return false;. If you want to stay on the same page and show a div, yet at the same time still submit the form data, you cn do that via ajax using $.post

$("form").submit( function () {
    $("#div").show();
    $.post('some_url_to_submit_to.php',$(this).serialize(), function(data){
        //some action to take on success... but not necessary
    })
    return false; // to prevent the form from redirecting to a new page
});