SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Mar 2010
    Location
    Pretoria, South Africa
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy GetElementById("ta") does not update with change in <textarea id=ta> and visa versa

    While this works in IE I just cant get it to work in Firefox. Any changes in the textarea are not passed on when you click the 'doit' button and the 'addTxt' button only works once. How can I get the 'doit' button to display the text entered into the textarea?

    Code HTML4Strict:
    <html>
      <head>
        <script type="text/javascript">
        <!--
        function addTxt(){
          document.getElementById("ta").innerHTML = 'Some New Text';
          document.getElementById("p1").innerHTML = '';
        }
        function doit(){
            var txt = document.getElementById("ta").innerHTML;
            document.getElementById("p1").innerHTML = txt;
        }
        //-->
        </script>
      </head>
      <body>
        <input type="button" value="addTxt" onclick="addTxt()">
        <br>
        <textarea name="ta" id="ta" rows="2" cols="15">Txt</textarea>
        <br>
        <input type="button" value="doit" onclick="doit()">
        <br>
        <p name="p1" id="p1"></p>
      </body>
    </html>

    Thanks for any help. I have been experimenting with all kinds of variations but just cant get it to work. Is there some way of refreshing the textarea element without having to refresh the whole page?

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why not use document.getElementById("ta").value = 'Some New Text' and
    var txt = document.getElementById("ta").value etc instead?

    .innerHTML is non-standard, while .value is in the DOM spec.
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Member
    Join Date
    Mar 2010
    Location
    Pretoria, South Africa
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks a lot! That seems to work - although only if I use .value on the textarea. The .value on "p1" does not work:
    works: document.getElementById("ta").value = 'Some New Text';
    works: document.getElementById("p1").innerHTML = '';
    does not work: document.getElementById("p1").value = '';

  4. #4
    SitePoint Wizard bronze trophy Immerse's Avatar
    Join Date
    Mar 2006
    Location
    Netherlands
    Posts
    1,661
    Mentioned
    7 Post(s)
    Tagged
    1 Thread(s)
    ta is a textarea and has a value attribute ('cos it's part of a form).
    p1 is a paragraph, and does not have a value.

    So for ta you want to use .value and for p1 .innerHTML.

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ^ What Immerse said.
    Birnam wood is come to Dunsinane

  6. #6
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    To further clarify what the others have said, only form controls (INPUT, BUTTON, TEXTAREA) can have "value" attributes.


Bookmarks

Posting Permissions

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