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 4 of 4

Thread: Dynamic Form

  1. #1
    New Coder
    Join Date
    Jan 2007
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Dynamic Form

    I would appreciate it if one of you lads could give me some javascript code.

    I would like to have a form that starts out with two radio buttons. If one is checked, two text box fields appear below it. If the other one is checked, two different text boxes appear below.

    Thanks
    Last edited by afrojojo; 01-09-2007 at 09:37 PM.

  • #2
    New Coder TripperTreats's Avatar
    Join Date
    Oct 2006
    Posts
    92
    Thanks
    0
    Thanked 0 Times in 0 Posts
    head javascript:
    Code:
    function showFirst () {
    document.getElementBy('text1').style.display="";
    document.getElementBy('text2').style.display="";
    document.getElementBy('text3').style.display="none";
    document.getElementBy('text4').style.display="none";
    }
    
    function showLast () {
    document.getElementBy('text1').style.display="none";
    document.getElementBy('text2').style.display="none";
    document.getElementBy('text3').style.display="";
    document.getElementBy('text4').style.display="";
    }
    HTML:
    Code:
    <form>
    <label for="first" onclick="showFirst()"><input type="radio" id="first" /></label>
    <label for="last" onclick="showLast()"><input type="radio" id="last" /></label>
    <input type="text" style="display:none" id="text1" />
    <input type="text" style="display:none" id="text2" />
    <input type="text" style="display:none" id="text3" />
    <input type="text" style="display:none" id="text4" />
    </form>
    Psychedelic digital art at www.trippertreats.com.

    "And in the end, the love you take
    is equal to the love you make
    ."

  • #3
    New Coder
    Join Date
    Jan 2007
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by TripperTreats View Post
    head javascript:
    Code:
    function showFirst () {
    document.getElementBy('text1').style.display="";
    document.getElementBy('text2').style.display="";
    document.getElementBy('text3').style.display="none";
    document.getElementBy('text4').style.display="none";
    }
    
    function showLast () {
    document.getElementBy('text1').style.display="none";
    document.getElementBy('text2').style.display="none";
    document.getElementBy('text3').style.display="";
    document.getElementBy('text4').style.display="";
    }
    HTML:
    Code:
    <form>
    <label for="first" onclick="showFirst()"><input type="radio" id="first" /></label>
    <label for="last" onclick="showLast()"><input type="radio" id="last" /></label>
    <input type="text" style="display:none" id="text1" />
    <input type="text" style="display:none" id="text2" />
    <input type="text" style="display:none" id="text3" />
    <input type="text" style="display:none" id="text4" />
    </form>
    I tried that, it doesn't work.

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Change every instance of
    document.getElementBy

    to:-
    document.getElementById


  •  

    Posting Permissions

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