Question

I have an input element with onchange="do_something()". When I am typing and hit the enter key it executes correctly (do_something first, submit then) on Firefox and Chromium (not tested in IE and Safari), however in Opera it doesn't (it submits immediately). I tried using a delay like this:

<form action="." method="POST" onsubmit="wait_using_a_big_loop()">
<input type="text" onchange="do_something()">
</form>

but it didn't work either.

Do you have some recommendations?

Edit: Finally I used a mix of the solutions provided by iftrue and crescentfresh, just unfocus the field to fire do_something() method, I did this because some other input fields had others methods onchange.

$('#myForm').submit( function(){
    $('#id_submit').focus();
} );

Thanks

Was it helpful?

Solution

You could use jquery and hijack the form.

http://docs.jquery.com/Events/submit

<form id = "myForm">

</form>

   $('#myForm').submit( function(){
   do_something();
   } );

This should submit the form after calling that method. If you need more fine-grained control, throw a return false at the end of the submit event and make your own post request with $.post();

OTHER TIPS

From http://cross-browser.com/forums/viewtopic.php?id=123:

Per the spec, pressing enter is not supposed to fire the change event. The change event occurs when a control loses focus and its value has changed.

In IE pressing enter focuses the submit button - so the text input loses focus and this causes a change event.

In FF pressing enter does not focus the submit button, yet the change event still occurs.

In Opera neither of the above occurs.

keydown is more consistent across browsers for detecting changes in a field.

I'm not great at Javascript, but could you do something like this?

<form name="myform" action="." method="POST">
<input type="text" onchange="do_something();document.myform.submit();">
</form>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top