Why does IE open form submission in a new window and not dynamically inserted iframe.

Question

I am trying to get post a form to a hidden, dynamically inserted iframe, but in Internet Explorer the form submission opens in a new window.

var iframe = document.createElement('iframe');
iframe.name = 'hidden_iframe';
iframe.className = 'NotVisible';
iframe.id = 'hidden_iframe';
document.body.appendChild(iframe);

var my_form = document.getElementById('my_form');
my_form.target = 'hidden_iframe';

This works in Firefox but not IE.

Answer 1

Apparently you need to include the name in the call to createElement. This works in IE and causes an exception in standards compliant browsers. We get:

var iframe;
try {
    iframe = document.createElement('<iframe name="hidden_iframe">');
} catch (ex) {
    iframe = document.createElement('iframe');
    iframe.name='hidden_iframe';
}

iframe.className = 'NotVisible';
iframe.id = 'hidden_iframe';
document.body.appendChild(iframe);

var my_form = document.getElementById('my_form');
my_form.target = 'hidden_iframe';

Answer 2

Could this not be more easily accomplished using an a AJAX submit? The iframe approach you're presenting is very hackish and prone to lots of issues.

Here is a JQuery Form plugin that makes doing AJAX submits easy by handling all the serialization of the form values for you.

Answer 3

Thanks a lot I was also havinbg same problem in post to iframe and your code 'iframe = document.createElement('');' fixed it '