...

View Full Version : Can someone help me create a script?



bellyache
01-23-2012, 02:00 AM
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?

jmrker
01-23-2012, 03:18 AM
Try this, but if you add more cities, make sure you understand the layout and how it should be altered. :eek:


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



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum