Hi, yesterday I had to fight against this problem, which is not very touched out there.
In the beginning, people from jQuery thought it was a jQuery bug, but searching a bit more I could find out the root of this problem.
What is it?
When running your javascript in Internet Explorer 6, or 7 or 8 in compatible mode, if you create dynamically an iframe, for example, and set it a name attribute, Internet Explorer will reaplace it by an submitName attribute. This attribute cannot be found with .getAttribute(’submitName’), but that is the problem, neither can be with .getAttribute(’name’)!
How to see it happening? Try this:
var ifr= document.createElement('iframe');
ifr.setAttribute('name', 'iFrameOne');
document.body.appendChild(ifr);
alert(ifr.getAttribute('name'));
// you can also see it through the "developer tool" in the IE tools menu
The main problem is that … when you have something like a link or a form targeting this iframe, you loose it! The same happens with inputs with name, which are dynamically created.
How to fix it without ask your users to migrate to a real browser? I did this and it worked:
var ifrDiv= document.createElement('div');
ifrDiv.innerHTML= "<iframe name='iFrameOne' ></iframe>";
document.body.appendChild(ifrDiv);
Now, why does it happen?!
I had the chance to search for this and found in the Microsoft’s webpage something about this old, known bug in Internet Explorer, with names on dynamic elements. Due to “fix” this, instead of fixing, then “provided” this workarounded attribute. When you try to deal with the name attribute, it applies like an alias, redirecting it to the Microsoft’s Internet Explorer imaginary submitName attribute. But with this, you cant access a form that has a name, like this:
document.forms['dynamicFormName'];
because the DOM hasn’t rendered that form with the name you asked for.
I hope it can help you, if you get stuck with this some day.
