www.webdeveloper.com
Results 1 to 10 of 10

Thread: problem with getElementById()

  1. #1
    Join Date
    Nov 2010
    Posts
    11

    Unhappy problem with getElementById()

    I'm having trouble getting the getElementById() command working properly, I've tested in various browsers and looked around to see if I can find the issue elsewhere and compared my code with others and I can't see a reason why it wouldn't work...

    Here's the code in my header:
    Code:
    function header(x,y)
    {
    	document.getElementByID(x).style.display = 'block';
    	document.getElementByID(y).style.display = 'none';
    }
    And the HTML:
    HTML Code:
    <form action="blah.html" method="post" enctype="multipart/form-data" name="adevent2">
       <input type="radio" name="heads" value="image" checked="checked" onselect="header('usefile','usecolour')" />Use background image<br /><br />
       <div id="usefile" style="display:block;">
          <label for="file">File to upload:</label>
          <input id="file" type="file" name="file" /><br />
       </div>
       <input type="radio" name="heads" value="colour" onselect="header('usecolour','usefile')" />Do not use background image<br /><br />
       <div id="usecolour" style="display:none;">
          <input type="text" id="headbgsample" name="headbgsample" size="1"  value=""><br />
       </div>

  2. #2
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,460
    Hi there Flessen,

    your problems are caused by a typing error.

    This...
    document.getElementByID
    ...should be...
    document.getElementById
    coothead

  3. #3
    Join Date
    Dec 2002
    Location
    St. Louis, MO, USA
    Posts
    1,582
    What coothead said, plus..

    Not every browser plays well with display="block", so use this, instead:
    Code:
    function header(x,y)
    {
    	document.getElementById(x).style.display = ''; //Set this to blank.
    	document.getElementById(y).style.display = 'none';
    }
    |||||
    o . Q
    ___ "You live and you learn; or you don't live long." - Lazarus Long

    ^_^

  4. #4
    Join Date
    Nov 2010
    Posts
    11
    thank you very much for the input, I'd completely overlooked that.. but for some reason, it's still not actually functioning...

  5. #5
    Join Date
    Dec 2002
    Location
    St. Louis, MO, USA
    Posts
    1,582
    Is there a JavaScript error?
    |||||
    o . Q
    ___ "You live and you learn; or you don't live long." - Lazarus Long

    ^_^

  6. #6
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,460
    Hi there Flessen,

    it appears that you are also using the wrong event handler.
    Try onclick instead.

    coothead

  7. #7
    Join Date
    Dec 2002
    Location
    St. Louis, MO, USA
    Posts
    1,582
    Quote Originally Posted by coothead View Post
    Hi there Flessen,

    it appears that you are also using the wrong event handler.
    Try onclick instead.

    coothead
    Good eye.. hadn't even looked at that part. Yes, onclick should do it.
    |||||
    o . Q
    ___ "You live and you learn; or you don't live long." - Lazarus Long

    ^_^

  8. #8
    Join Date
    Nov 2010
    Posts
    11
    Thank you very much, I originally used onclick, I switched to onselect hoping it would resolve the problem, turns out that attempt at a resolution just worsened things _

    Either way, I've got it working now, thanks to your keen eyes. I appreciate the help guys ^_^

  9. #9
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,460
    No problem, you're very welcome.

  10. #10
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by WolfShade View Post
    What coothead said, plus..

    Not every browser plays well with display="block"
    No. All the browsers play well with the display block. But not all the elements, according to the standards, may have the display "block". For instance tables and table elements. They have specific "positive" display, but not "block":

    http://www.w3.org/TR/CSS2/tables.html#table-display

    Well, not for IE < 9. IE uses "block" and not the standard table display. Therefor, but only in this case (table and table elements) it is valuable what you have said: the empty value "" is cross browser, while "block" it is not

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