CODEWITHSUNDEEP
javascripthtml
user188962
user188962

Reputation:

'Enter key' wont submit form in Firefox, but will in Chrome, why?

I have a form, very basic, and when I hit enter key nothing happens in firefox, but in google chrome it submits. Haven't tried other browsers yet...

Nothing happens at all when hitting enter in firefox.

When clicking the submit button it works fine in both browsers.

The form is inside a DIV, and the form has javascript too, here is the form simplified:

<form id="nav_form_main" name="nav_form_main" action="bincgi/sql_query.php" target="iframe001" method="get" onSubmit="reset_pager();">

<input type="button" name="nav_submit" id="nav_submit" value="Search" onClick="reset_and_subm();" style="width: 58px; font-size: 13px;">

//some other elements...

</form>

and here is the js:

function reset_pager(){
    byId("p").value = 0;
}
function reset_and_subm(){
    byId("p").value = 0;
    document.forms["nav_form_main"].submit();   
}

The reset_pager function is not called at all... which is strange because it is an "onsubmit" function. So it is like the form isn't submitted at all. However, the results in the targeted iframe appear fine, without any problem.

Any ideas?

Thanks

Upvotes: 7

Views: 9976

Answers (2)

ntownsend
ntownsend

Reputation: 7630

As Diodeus mentioned, you need an <input type="submit"> tag in your form if you want to use the ENTER key to submit the form.

The reason that your reset_pager function is not firing on the onsubmit event is because the onsubmit event is never fired. Though it's somewhat counter-intuitive, using the submit() method on a form (as you're doing in your reset_and_subm function) will not cause the onsubmit event to fire.

You have a couple options:

  1. You can add an <input type="submit"> to your form and put all your logic in an onsubmit callback function.

  2. Watch all keypress events on the form. If the ENTER key is pressed or the button is clicked, then call a function that does all the stuff you want to happen before submitting the form and then call submit() on the form.

Upvotes: 3

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

Enter for submit is only triggered if <input type="submit> exists on the form. You can add a hidden one for this purpose, but keep in mind that it will submit the form and bypass the onclick event you're looking to capture. You'll need to patch into the onsubmit action of the form to run your function.

Upvotes: 9

Related Questions