www.webdeveloper.com
Results 1 to 4 of 4

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

  1. #1
    Join Date
    Jul 2012
    Posts
    5

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

    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?

  2. #2
    Join Date
    Mar 2011
    Posts
    1,141
    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?
    Rick Trethewey
    Rainbo Design

  3. #3
    Join Date
    Jul 2012
    Posts
    5
    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!

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    Quote Originally Posted by A5H View Post
    ... 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...
    try this

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>name</title>
    <script type="text/javascript">
    // 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+='<div'+styl+'><i><b>'+i+'</b></i> = '+newOne[i]+';</div>'
    }
    try{doc('nm').scrollIntoView(true);}catch(e){}
    }
    window.onload=function(){
    var isIE=(navigator.userAgent.indexOf('MSIE')>0)?true:false;
    doc('btn').onclick=function(){
    isIE?crt():alert('Congrats! Your browser is better than IE!');
    }
    }
    </script>
    </head>
    <body>
    <center>
    <div id="targ">target</div>
    <br /><br />
    <input type="button" id="btn" value="Create" />
    <br /><br />
    <div id="descr">description</div>
    </center>
    </body>
    </html>
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles