/    Sign up×
Community /Pin to ProfileBookmark

element.setAttribute("name", "some-name") won’t work in IE?

Copy linkTweet thisAlerts:
Sep 06.2013

I’ve read that apparently using the setAttribute function to dynamically set the name attribute to an element won’t work in IE? Quite a lot of people have said that this is an inherent bug in IE where it will set common attributes like the ‘id’ or ‘cols’ or ‘rows’ etc, but it will not set the ‘name’.

One work around I thought I had discovered was to set the name field by calling it by it’s ID. document.getElementById(“some-id”).name = “some-name”;

But the only problem with the above work around is that for some seriously weird reason it appears in the element like so:
<input type=”text” submitName=”some-name” id=”some-id”>

Why is it setting to submitName? And is there any other way I can dynamically set the name?

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@rtretheweySep 06.2013 — I've used setAttribute() without problems in IE, so if there ever was a problem it's likely to have been very old versions. Stuff you find on the web could be many years old and no longer valid. Have you tested your code in recent versions using setAttribute() or are you just relying on what you've read?
Copy linkTweet thisAlerts:
@A5HauthorSep 06.2013 — Yeah most of those posts I read were referring to versions 6/7 of IE. But despite that I did give the code a go with the setAttribute function in IE9 and it still automatically set it to the attribute submitName as supposed to name. That's what kicked off my extensive googling...

I have however discovered a different work around though I don't like it too much because of how messy it looks in the code but I can't seem to think of any other way.

This is what I done:

input = document.createElement('<input name="'+attrName+'">');

I did read somewhere that if the attribute name is already established in the element then it will set it if you set it through the setAttribute function. However if that particular element doesn't exist with the initial load of the page and you are dynamically creating that element when a button is pressed or something then you'll run into problems with trying to set a name attribute.

Either way thanks for your response!
Copy linkTweet thisAlerts:
@PadonakSep 06.2013 — ... However if that particular element doesn't exist with the initial load of the page and you are dynamically creating that element when a button is pressed or something then you'll run into problems with trying to set a name attribute...[/QUOTE]

try this

<i>
</i>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;name&lt;/title&gt;
&lt;script type="text/javascript"&gt;
// shorthand for the document.getElementById
function doc(id){return document.getElementById(id);}
function crt(){
// empty divs if already filled
doc('targ').innerHTML=doc('descr').innerHTML='';
// creating the input
var inp=document.createElement('input');
// setting its attributes
inp.type='text';
inp.size='50';
inp.placeholder=inp.name='thisElementNameAttributeIwouldLikeToBe';
inp.id='new_input';
// appending
doc('targ').appendChild(inp);
var newOne=doc('new_input');
// showing its properties
for(var i in newOne){
var styl=(i==='name')?' style="color:Crimson" id="nm"':'';
doc('descr').innerHTML+='&lt;div'+styl+'&gt;&lt;i&gt;&lt;b&gt;'+i+'&lt;/b&gt;&lt;/i&gt; = '+newOne[i]+';&lt;/div&gt;'
}
try{doc('nm').scrollIntoView(true);}catch(e){}
}
window.onload=function(){
var isIE=(navigator.userAgent.indexOf('MSIE')&gt;0)?true:false;
doc('btn').onclick=function(){
isIE?crt():alert('Congrats! Your browser is better than IE!');
}
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;center&gt;
&lt;div id="targ"&gt;target&lt;/div&gt;
&lt;br /&gt;&lt;br /&gt;
&lt;input type="button" id="btn" value="Create" /&gt;
&lt;br /&gt;&lt;br /&gt;
&lt;div id="descr"&gt;description&lt;/div&gt;
&lt;/center&gt;
&lt;/body&gt;
&lt;/html&gt;
×

Success!

Help @A5H spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...