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

Thread: Javascripting

  1. #1
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Javascripting

    Im trying to use button on the main page. When that button is cliked, it calls a function to display the other buttons. Im displaying the buttons using document.write function. But the other buttons go onto the different.
    How to get them on the same page??
    The code i use to do this is:
    <html>
    <head>
    <script type="text/javascript" src="loadxmldoc.js">

    </script>
    </head>
    <script type="text/javascript">

    </script>
    <form id="form1">
    <button id="button1"onclick='call()'>Get CD info</button>
    </form>


    <script type="text/javascript">
    function call()
    {
    document.write("<input type='button' onclick='go1()' value='Title list'>");
    document.write("<input type='button' onclick='go2()' value='Artist List'>");
    document.write("<input type='button' onclick='go3()' value='Country List'>");
    document.write("<input type='button' onclick='go4()' value='Company List'>");
    document.write("<input type='button' onclick='go5()' value='Price List'>");
    document.write("<input type='button' onclick='go6()' value='Year List'>");
    }
    </script>
    </body>
    </html>

  • #2
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    Don't use document.write for that.
    Use either DOM or innerHTML.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    Here you are:-

    Code:
    <form id="form1">
    <button id="button1"onclick='call()'>Get CD info</button>
    </form>
    
    <div id = "div1" style="visibility:hidden">
    <input type='button' onclick='go1()' value='Title list'>
    <input type='button' onclick='go2()' value='Artist List'>
    <input type='button' onclick='go3()' value='Country List'>
    <input type='button' onclick='go4()' value='Company List'>
    <input type='button' onclick='go5()' value='Price List'>
    <input type='button' onclick='go6()' value='Year List'
    </div>
    
    <script type = "text/javascript">
    function call() {
    document.getElementById("div1").style.visibility="visible";
    }
    </script>

    Haikus are easy
    But sometimes they don't make sense.
    Refrigerator.

  • Users who have thanked Philip M for this post:

    dolton (08-31-2008)

  • #4
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts
    That was so knowledgeable! Thanks.
    Also if u refer to that example in reply, if i click on 'title list" button it calls the function go1().
    How do i get the output of that also on the same page?

  • #5
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    That's what I meant.
    Code:
    <form id="form1">
    <button id="button1"onclick='call()'>Get CD info</button>
    </form>
    
    <div id = "div1" style="visibility:hidden">
    <input type='button' onclick='go1()' value='Title list'>
    <input type='button' onclick='go2()' value='Artist List'>
    <input type='button' onclick='go3()' value='Country List'>
    <input type='button' onclick='go4()' value='Company List'>
    <input type='button' onclick='go5()' value='Price List'>
    <input type='button' onclick='go6()' value='Year List'
    </div>
    <div id="go1">
    </div>
    
    <script type = "text/javascript">
    function call() {
    document.getElementById("div1").style.visibility="visible";
    }
    function go1()
    {
    document.getElementById("go1").innerHTML = "OutPut"
    }
    </script>

  • Users who have thanked BarrMan for this post:

    dolton (08-31-2008)

  • #6
    New to the CF scene
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    2
    Thanked 0 Times in 0 Posts
    function go1()
    {
    document.getElementById("go1").innerHTML = "OutPut"
    }
    ------instead of the "output", can we call another function in there.
    like the following:
    function go1()
    {
    document.getElementById("go1").innerHTML= list()
    }
    Function list()
    {
    document.write("hello")
    }
    but this goes to another page again...... javascripting if fun!

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    You cannot have a function with the same name (go1) as a <div> or other element.

    Once more, avoid document.write. Use DOM or innerHTML.


  •  

    Posting Permissions

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