IE6 and form.submit() bug workaround
Javascript November 3rd, 2009IE6………one of life’s great mysteries. I think we may need some federally enforced browser standards more than a new health care system, but that’s just me.
In IE6, programatically triggering the submit() method of a form element doesn’t *always* seem to work. There’s no logical reason - it just doesn’t. I’ve run into this problem twice now. The first time, I just ended up building a query string out of the form variables and using window.location to send them to the action page. That was with a static form. I just hit this wall again with a form I’m building dynamically.
For *whatever* reason, delaying the submit action by 100ms works like a charm. I wish I could tell you more, but as with all IE6 bug fixes, when they work, I try not to ask questions.
Here’s what I ended up doing:
I tried building the form through the browser’s native methods, using document.createElement() and element.appendChild(), which didn’t make a difference, so I reverted back to created the form with jQuery. So, here’s what I ended up doing….
/* ....build form elements using jQuery... */
$j("body").append(form);
setTimeout(function(){
form.submit();
}, 100);
Hope this saves someone some time! If you’re dealing with a form that is not being built dynamically, I have an inkling that this may not work. Still, delaying the event another way might. Try this, and if it works for you, let me know!
<a href="javascript:;" onclick="setTimeout(function(){ form.submit() }, 100)">Submit</a>
That’s the onclick event of an anchor tag, but the same would apply for the onclick of any element.
November 20th, 2009 at 2:47 pm
Your workaround got me thinking that the bug is caused by bad event handling of IE6. For a anchor that refused to submit from the onclick event, I changed onclick to onmousedown. The form submitted. Thanks. But thank MS for 2 and 1/2 hours well spent.
December 1st, 2009 at 1:30 pm
Ah, good thinking. Just remember that the default behavior for a button/link is to perform its action onmouseup. Did you try that event?
January 5th, 2010 at 7:38 pm
I ran into this problem today and reached the same solution you did. The only reason I thought to use the delay was because I set an alert() to trigger after the form.submit(), and noticed that in the time it took me to close the alert dialog, the form submitted. I found your post when I started Googling to find out *why* that works. Still didn’t answer that question, but maybe you’re right- maybe it’s best not to ask.