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 3 of 3
  1. #1
    New Coder
    Join Date
    Aug 2009
    Location
    Iowa, US
    Posts
    30
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Question Help Creating Dynamic Buttons from Array

    Hey all! So there I was newly hired and tasked with pouring through someone else's code to see what could be modified and brought up to date. After successfully finding the errors and correcting them and fulfilling the tasks my new supervisor assigned me, he slaps me on the back and says, "Well done! Now make it dynamic!" By which he meant the chapter buttons I spent hours creating from the existing code.

    Here's what he wants: the old code has an array, we'll call it someArray, that is assigned its values by the instructional developer as html pages are added to the course. So for example the code might look like this,
    Code:
    var someArray = new Array(4);
        
        someArray[0] = "video1/video1.html";
        someArray[1] = "video2/video2.html";
        someArray[2] = "video3/video3.html";
    Now, each page has an associated chapter button. So video1/video1.html would have ch1Btn, video2/video2.html would have ch2Btn and so forth. Each button in turn calls a specific function which does only one thing - sets the currentPage variable to page associated with that button/array contents. For example, I have created the following functions to call each page:
    Code:
    	
            function doCh1(){currentPage = 0; goToPage();}
    	function doCh2(){currentPage = 1; goToPage();}
    	function doCh3(){currentPage = 2; goToPage();}
    I should mention that all this is being done from within an html wrapper that calls each page into an iframe. The currentPage variable is assigned the url of one of the elements from the pageArray.

    My supervisor wants to be able to manually add pages to the pageArray and have the javascript code generate the associated buttons and function calls so when the learner clicks on one of the dynamically created buttons, s/he is taken to the correct page.

    Currently I'm using static images with the onclick calling the correct function to set my currentPage value and send the learner on his/her merry way.

    Is there a way to do all of this dynamically? If so, can you help me get my head around this by providing some examples?

    Sorry for the long post.

    Thank you,

    M

  • #2
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,108
    Thanks
    38
    Thanked 498 Times in 492 Posts

    Lightbulb Try this ...

    I don't know if this will fit into you needs, but see if you can use it.
    Code:
    <html>
    <head>
    <title>Dynamic Button Links</title>
    <script type="text/javascript">
    // From: http://codingforums.com/showthread.php?t=175600
    
    var btnLinks = [
      ['Google','http://www.google.com'],
      ['Yahoo','http://www.yahoo.com'],
      ['bling','http://www.bling.com'],
      ['NSU','http://www.nova.edu'],
      ['Optometry','http://optometry.nova.edu']	// Note: no comma at end
    ];
    
    function ButtonLinks() {
      var str = '';
      for (var i=0; i<btnLinks.length; i++) {
    // For testing purposes
    //    str += '<button onclick="alert(\''+btnLinks[i][1]+'\')">';	
    //    str += '<button onclick="document.location.href=\''+btnLinks[i][1]+'\'">';
        str += '<button onclick="document.getElementById(\'Iframe1\').src=\''+btnLinks[i][1]+'\'">';
        str += btnLinks[i][0]+'</button><br>';
      }
      return str;
    }
    
    </script>
    </head>
    <body>
    <script type="text/javascript">
      document.write(ButtonLinks());
    </script>
    
    <iframe  id="Iframe1"  frameborder="0"  vspace="0"  hspace="0" marginwidth="0"  marginheight="0"
             width="600"  scrolling="yes"  height="400"  src="http://www.yahoo.com">
    </iframe>
    </body>
    </html>
    Good Luck!

  • #3
    New Coder
    Join Date
    Aug 2009
    Location
    Iowa, US
    Posts
    30
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Thanks!

    Thank you for the suggestion. I can't get to it today but hope to try it out on Monday. I'll let you know how it goes.


  •  

    Tags for this Thread

    Posting Permissions

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