Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Apr 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile MULTIPLE LIVE PREVIEWS of form

    Hi,

    I've got this script that shows a live real time preview of text typed in a form input area.

    <script>
    function preview(id1, id2){
    var NewText = document.getElementById(id1).value;
    splitText = NewText.split(/\n/).join("<br />");
    var DivElement = document.getElementById(id2);
    DivElement.innerHTML = splitText;}
    </script>


    BODY

    There are two regions, one for the form and the other for the corresponding Preview area.

    <form action="#">
    <label>Address:</label>
    <input type="text" id="address" onKeyUp="preview('address', 'preview-address');" />
    </form>

    <h1>Preview</h1>
    <dl>
    <dt>Address:</dt>
    <dd id="preview-address"></dd>
    </dl>

    Well, how can I get more Preview areas? If I try copying the preview areas code twice, I still get just one preview. Can anyone get this, and show more than one multiple previews of the text typed in a form, cool...

    Example:

    Color: ________

    So when you type in the Color form field, say

    Color : Red

    Then in the form Preview, what to do so that it appears twice or more like this:

    Previews:

    Red

    Red

    Red

    Thanks and have a great time.
    Last edited by starshine; 04-16-2008 at 05:19 PM.

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    Are you giving them different ids after you copied them?

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]


  •  

    Posting Permissions

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