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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Can someone help me create a script?

    I am trying to create a basic javascript that shows milage between severag areas, similar to what you find on the rear road atlas.
    I have tried and failed to create anything, i just think i am total useless at understanding javascript.

    The basic concept is this image attached.

    There would be a drop down box that lists the destinations and another with the same but would be departure.
    When a person chooses example: Butte >>> Kalipsell it would show 238 and vice versa.
    it seems a simple thing to do but cant get my head around it all.
    Could someone create a simple script, say 3 destinations and i will fill the rest in and see if i can understand what i am doing and then ask for additional help if required?
    Attached Thumbnails Attached Thumbnails Can someone help me create a script?-mileage-chart.jpg  

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

    Lightbulb Something to consider...

    Try this, but if you add more cities, make sure you understand the layout and how it should be altered.
    Code:
    <html>
    <head>
    <title> Milage Chart </title>
    <script type="text/javascript">
    // For: http://www.codingforums.com/showthread.php?t=249544
    
    var cities = [
     ['Billings',     0,143,228,219,241],
     ['Bozeman',    143,  0, 86,185, 98],
     ['Butte',      228, 86,  0,155, 69],
     ['Great Falls',219,185,155,  0, 91],
     ['Hellena',    241, 98, 69, 91,  0]
    ];
    
    function setOptions(SBox){
      var choices = [];
      var sel = document.getElementById(SBox);
      sel.options.length = 0;
    //  sel.options[sel.options.length] = new Option('Select','',false,false);
      for (i=0; i<cities.length; i++) {  
        sel.options[sel.options.length] = new Option(cities[i][0],cities[i][0],false,false);
      }
      sel.selectedIndex = 0;
    }
    
    function showDistance() {
      var from_city = document.getElementById('fromCity').selectedIndex;
      var to_city = document.getElementById('toCity').selectedIndex;
      alert('Distance between is: '+cities[from_city][to_city+1]);
    }
    
    window.onload = function () {
      setOptions('fromCity');
      setOptions('toCity');
    }
    </script>
    
    <style type="text/css">
    
    </style>
    </head>
    <body>
    From: <select id="fromCity"></select>
    To: <select id="toCity"></select>
    <button onclick="showDistance()">Distance</button>
    </body>
    </html>


  •  

    Posting Permissions

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