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 14 of 14
  1. #1
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts

    setting a variable using a radio button

    Hi,

    I have a variable:

    Code:
    var step = 5;
    that is referenced by this function:


    Code:
    function animate(d) {
            if (d>eol) {
              return;
            }
            var p = poly.GetPointAtDistance(d);
    		if (k++>=180/step) {
              map.panTo(p);
              k=0;
            }
            map.panTo(p);
            marker.setPoint(p);
    		if (supportsCanvas) {
              if (poly.GetIndexAtDistance(d)>lastVertex) {
                lastVertex = poly.GetIndexAtDistance(d);
                if (lastVertex == poly.getVertexCount()) {
                  lastVertex -= 0;
                }
                while (poly.getVertex(lastVertex-2).equals(poly.getVertex(lastVertex-1))) {
                  lastVertex-=1;
                }
                angle = bearing(poly.getVertex(lastVertex-2),poly.getVertex(lastVertex-1) );
                plotcar();
    
              }
            }
            
    	if(!paused){
    		setTimeout("animate("+(d+step)+")", tick);
    	} else {
    		continueStep=d+step;	
    	}
    }
    and I would like for the user to have the option of setting that variable using radio buttons- say to 5, 7 or 10

    is it possible?

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    Code:
    <label><input type="radio" name="stepsize" onclick="step=5"> step 5</label>
    <label><input type="radio" name="stepsize" onclick="step=7"> step 7</label>
    <label><input type="radio" name="stepsize" onclick="step=10"> step 10</label>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    thanks.

    just one more dumb question -

    should I be doing something with the original

    var step = 5;

    ?

    I commented it out and now I get a "step is not defined" error...

    here's the page if you want to have a look

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    no, cancel that - I think google maps was just having a moment.

    Thanks again, Old P.

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    The variable *MUST* be defined in the global scope of JavaScript.

    That is, *OUTSIDE* of any function.

    Code:
    <script type="text/javascript">
    // Global variable that controls how fast the bus goes
    var steps = 5; // 5 is the default
    
    ... other code ...
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    right. got it. thanks again.

  • #7
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts

    ... but not in Chrome

    just one thing:

    this works great in FF and as well as it ever did in IE, but the buttons have absolutely no effect in Chrome.

    is there some reason for that, or some way around it?

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    Do the buttons *CHANGE* the value????

    Is that where the problem is, or is the problem that the value is just being ignored?

    To find out, DEBUG! This time, using alert()'s.

    Code:
    var shown = false; // added flag to help debugging
    
    function animate(d) {
            if ( ! shown ) {
                alert("In animate, step is " + step );
                shown = true; // so this doesn't happen every time!
            }
            // continue with rest of code...
            if (d>eol) {
              return;
            }
            ... etc. ...
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    And/or do it here:
    Code:
    <label>
        <input type="radio" name="stepsize" 
               onclick="alert('before:' + step); step=10; alert('after:' + step);"> 
        step 10
    </label>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #10
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    Quote Originally Posted by Old Pedant View Post
    Do the buttons *CHANGE* the value????
    No, they don't - according to the alerts, Chrome is still working off the global var, regardless of what button is selected.

  • #11
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    Okay, I have to see this for myself!

    Back shortly.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #12
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    Well, it's something about your page, I guess.

    Maybe change the variable name??? Just in case it's mixed up with an internal name????

    Because this code worked in all browsers I tried (IE/FF/Chrome):
    Code:
    <html>
    <head>
    <script type="text/javascript">
    var steps = 5;
    
    function showit()
    {
        document.getElementById("SHOW").innerHTML = steps;
    }
    </script>
    </head>
    <body onload="setInterval(showit,250);">
    Current value of steps is <span id="SHOW"></span>
    <hr>
    <form>
    <label><input type="radio" name="xyz" onclick="steps=5"> Five </label>
    <label><input type="radio" name="xyz" onclick="steps=12"> Twelve </label>
    <label><input type="radio" name="xyz" onclick="steps=12345678"> Big number </label>
    </form>
    
    </body>
    </html>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    xelawho (12-10-2010)

  • #13
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,678
    Thanks
    80
    Thanked 4,646 Times in 4,608 Posts
    You'll notice that I purposely decoupled the setting of the value (in the radio buttons) from the display (done via the code invoked by setInterval, similar to what your code does, at least).
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #14
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    Quote Originally Posted by Old Pedant View Post
    Maybe change the variable name??? Just in case it's mixed up with an internal name????
    yup. that got it. thanks.

    and now if I could just get this function to restart with the onclick, I'd be extremely happy...


  •  

    Posting Permissions

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