How do I update text in Javascript?

Discussion in 'Web Design and Development' started by pierce111, Sep 5, 2008.

  1. pierce111 macrumors newbie

    Joined:
    Aug 2, 2008
    #1
    Hi everyone. When I get rid of a object on my webpage with ".removeChild", I am not sure how to update the other text on the page. I should point out that I am creating the objects with the ".createElement" command.

    Example of what I mean:
    You get ten buttons to delete. They all show you which number button they are. If you delete one button, then the rest update their "button number" so there isn't a "gap in the numbering".


    If anyone could help, it would be great!
     
  2. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #2
    Well your example isn't very specific. There can be a number of ways to do things depending on the exact HTML you're working with. One thing to look at though is .innerHTML. For instance, if your object was a p tag you could do:

    PHP:
    pObject.innerHTML "New text.";
    I think this might be what you're trying to get at. If not, give a little more detail on what you're up to.
     
  3. pierce111 thread starter macrumors newbie

    Joined:
    Aug 2, 2008
    #3
    Sorry about that. :eek: I am rather new to Javascript, so I don't really know how to describe everything yet.

    Unfortunately, I don't think that would work in this instance... Here's some more details:

    Step 1: Creates several "DIV" elements with the command: ".createElement"
    Step 2: Sets the text inside the "DIV" tag using ".innerHTML" (different for each element"
    Step 3: Shows the user the text with a delete button
    [What I want to do]
    Step 4: User deletes the text and then the other "DIV" tags adjust the change (the ones above goes down by 1 ex. [Testing 31] to [Testing 30])

    I hope that's a better explanation. :)
     
  4. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #4
    Yes, that explains it better. It sounds like you already have the code for removing the code so I'll just show you some renumbering code that you hopefully can apply to what you have.

    HTML
    HTML:
    <div id="divs">
      <div>1 <input type="button" value="delete" onclick="RenumberDivs()" /></div>
      <div>2 <input type="button" value="delete" onclick="RenumberDivs()" /></div>
      <div>10 <input type="button" value="delete" onclick="RenumberDivs()" /></div>
    </div>
    JavaScript
    PHP:
    function RenumberDivs()
    {
      var 
    divs document.getElementById("divs").getElementsByTagName("div");
      for (var 
    x=0y=divs.lengthyx++) {
        
    divs[x].innerHTML = (x+1) + " <input type='button' value='delete'"
          
    +" onclick='RenumberDivs()' />";
      }
    }
    For you, you'll want the "Delete" buttons onclick to call your delete function rather than this renumbering function. Then at the end of your delete function you can call the RenumberDivs function. You'll then have to of course make some edits in the JavaScript when it applies the button and onclick attribute.

    Hope this helps.
     
  5. pierce111 thread starter macrumors newbie

    Joined:
    Aug 2, 2008
    #5
    Thanks for your help. :) I had to edit it a little to do what I needed it to do, but now it works great!
     

Share This Page