Browser compatibility woes, getting a form to submit in a onclick event in IE

Big fun, testing my web application in firefox, it just works. Once I moved to internet explorer, my links don’t work. After a couple of hours of fiddling, I produced the following testcase which shows the browser compatibility problem (and the solution).

<html><body>

<form id="form" action="bla" method="post" onsubmit="alert('SUBMIT');">

<br/>
<a href="javascript:;" ondblclick="test();">dblclick</a>
<br/>
<a href="javascript:;" onclick="test();">click</a>
<br/>
<a href="javascript:test();" >click in href</a>

</form>
<script type="text/javascript">
function test()
{
    alert('test called');
    document.getElementById( 'form' ).submit();  
}
</script>
</body></html>

If you load this in firefox, the behaviour is the same for all three links (the first needs a double click), a “test called” alert box, followed by a redirection to a (non-existing) page.

In IE, a doubleclick on the first link and a click on the third (“click in href”) link both work as expected. However, if you click on the link which has the form submit function called in the “onclick” event, the alert box shows but the form redirect does not happen. Grmmbl.

Leave a Reply

Your email address will not be published. Required fields are marked *

question razz sad evil exclaim smile redface biggrin surprised eek confused cool lol mad twisted rolleyes wink idea arrow neutral cry mrgreen

*