SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2001
    Location
    Pacific NW
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    need to have more than one changeurl()

    I'm working on site where the navigation loads new content into the top and bottom frames. I found this script at 3schools and modified it to work with an href tag rather than a button. If that were all I needed, it'd all be good cuz it works just fine. But I need to take it a step further and use the changeurl() function on more than one href tag. I tried defining more than one function like this: changeurl(category1) then define the frames and sources for each category, but it's not working. How can I have more than one changeurl()?

    TIA!

  2. #2
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Parameters baby!
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function changeurl(urlUpper, urlLower)
    {
    parent.upperframe.location.href=urlUpper;
    parent.lowerframe.location.href=urlLower;
    }
    </script>
    </head>
    <body>
    <form>
    <input type="button" value="Change url"
    onclick="changeurl{'demo_js_frame_c.htm','demo_js_frame_d.htm')"><br>
    
    <a href="javascript:;" onClick="changeurl('page1.htm','page2.htm');">Click here</a>
    
    </form>
    </body>
    </html>
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  3. #3
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    Svj
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Like this?
    Code:
    <html>
      <head>
        <script type="text/javascript">
          function changeurl(category)
          {
            switch(category)
            {
              case 1:
                url1 = "page1.htm";
                url2 = "page2.htm";
                break;
              case 2:
                url1 = "page3.htm";
                url2 = "page4.htm";
                break;
            }
            parent.upperframe.location.href = url1;
            parent.lowerframe.location.href = url2;
          }
        </script>
      </head>
      <body>
        <a href="javascript://" onClick="changeurl(1)">Link 1</a>
        <a href="javascript://" onClick="changeurl(2)">Link 2</a>  
      </body>
    </html>

  4. #4
    SitePoint Enthusiast
    Join Date
    Nov 2001
    Location
    Pacific NW
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by beetle
    Parameters baby!
    That's all I needed to do... thanks beetle. I was trying to define the categories as paramaters, which, of course wasn't working. Thank you so very much. I would kiss you if I could!

    Thanks for your response as well jofa. I am wondering what the switch is for? I don't know much javascript and haven't used it.

  5. #5
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A switch/case statement is a faster/better way to implement conditional steps. Let's take this example...
    Code:
    <script>
    function showMessage(v) {
    	var msg;
    	switch (v) {
    		case 'g'	:	msg = "Wonderful! I'm great too!"; break;
    		case 'o'	:	msg = "Ok is better than bad!"; break;
    		case 'b'	:	msg = "I'm sorry, hope you feel better later!"; break;
    		default		:	msg = "You didn't pick a feeling!";
    		}
    	alert(msg);
    	}
    </script>
    
    How do you feel today?<br>
    <select onChange="showMessage(this.options[this.selectedIndex].value);">
    <option value="">Pick one</option>
    <option value="g">Great!</option>
    <option value="o">Ok</option>
    <option value="b">Bad</option>
    </select>
    AS you can see, the value that ends up in the variable 'v' is what is checked with each case. If the value isn't found, then the default case is performed. Notice how each case has a break; line after it? This prevents the switch statment from performing the next case. When the case is found, those code lines are run, but if there is no break;, the switch statment runs all proceeding cases until a break is found. Not many poeple use switch/case statements w/o the break;s in place, but here's an example of when it is beneficial
    Code:
    <script>
    function showCountdown(v) {
    	var msg = "";
    	switch (parseInt(v)) {
    		case 10	:	msg += "Ten, ";
    		case 9	:	msg += "Nine, ";
    		case 8	:	msg += "Eight, ";
    		case 7	:	msg += "Seven, ";
    		case 6	:	msg += "Six, ";
    		case 5	:	msg += "Five, ";
    		case 4	:	msg += "Four, ";
    		case 3	:	msg += "Three, ";
    		case 2	:	msg += "Two, ";
    		case 1	:	msg += "One. Blastoff!! ";break;
    		default	:	msg = "No countdown today?";
    		}
    	alert(msg);
    	}
    </script>
    
    Countdown from?<br>
    <select onChange="showCountdown(this.options[this.selectedIndex].value);">
    <option value="">Pick one</option>
    <option value="10">10</option>
    <option value="9">9</option>
    <option value="8">8</option>
    <option value="7">7</option>
    <option value="6">6</option>
    <option value="5">5</option>
    <option value="4">4</option>
    <option value="3">3</option>
    <option value="2">2</option>
    <option value="1">1</option>
    </select>
    There, as you can see, with no break; in place the switch statement keeps on going. Hope this clears up switch/case statements for ya
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  6. #6
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    Svj
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    switch == if...else if...else if...else if...else if

    Better if you have a lot of options where only one can be true - and I guess the categories are more than two

    I think my alternative is better than beetle's (not only because it's written by me ) if you need to call changeurl() with the same parameters from another link

  7. #7
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    Svj
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    beetle, I think
    this.options[this.selectedIndex].value)
    is equal to
    this.value

  8. #8
    SitePoint Enthusiast
    Join Date
    Nov 2001
    Location
    Pacific NW
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is case a js function or statement (or whatever)... or something you defined?

  9. #9
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    Svj
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  10. #10
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by jofa
    switch == if...else if...else if...else if...else if

    Better if you have a lot of options where only one can be true - and I guess the categories are more than two

    I think my alternative is better than beetle's (not only because it's written by me ) if you need to call changeurl() with the same parameters from another link
    Yes, it is better. Not only does it makes the links reusable, but also uses just 1 parameter.
    Originally posted by jofa
    beetle, I think
    this.options[this.selectedIndex].value)
    is equal to
    this.value
    Not in every broswer. this.options[this.selectedIndex].value is much more universal
    Originally posted by alda.b
    Is case a js function or statement (or whatever)... or something you defined?
    I believe the proper term for case is 'construct'
    Last edited by beetle; Sep 19, 2002 at 17:55.
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev





Bookmarks

Posting Permissions

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