How to make simple calculation with JavaScript to know travel time?

Question

I'm stuck on this and it's so simple but I don't understand anything of JavaScript.

Basically I want to create a simple calculation to know the travel time, based on three different variables. I'm Dutch so some words are Dutch and some are English in the code. The first variable is the "woonplaats" which is the starting location. The second one is the "bestemming" which is the location of destination. The third one is the "vervoer" which is the vehicle you'll travel by.

Now all of these variables have a standard value. So the only thing that needs to be done is the calculation.

This is what my script code looks like:

function location() {

var woonplaats = document.getElementById("woonplaats").value;


switch (woonplaats) {
    case "amstelveen":
        locationAm();
        break;
    case "badhoevedorp":
        poelBa();
        break;

div2.innerHTML = "Jouw gemiddelde reistijd is: <b>" + tijd + "</b> km/h";




function locationAm() {

    var e = document.getElementById("bestemming");
    var eindbest = e.options[e.selectedIndex].value;
    var x = document.getElementById("bestemming");
    var vervoer = x.options[e.selectedIndex].value;


        if (eindbest == ameer) {
            var distance = 14500 ; }

            else if (eindbest === groning) {
            var distance = 183000 ; }

            else if(eindbest === zwolle) {
            var distance = 114000 ;
            }


        if (vervoer === kuruma ) {
            var time = distance / 28 ;
        }

        else if (vervoer === jitensha) {
         var time = var distance / 4 ;

         }

         else if ( vervoer === densha) {
         var time = var distance / 56 ;

         }

         else if (vervoer === scoot) {
         var time = var distance / 8 ; }




    div2.innerHTML = "your travel time will be <b>" + time + "</b> km/h";

}

function locationBa() {


    var e = document.getElementById("bestemming");
    var eindbest = e.options[e.selectedIndex].value;
    var x = document.getElementById("bestemming");
    var vervoer = x.options[e.selectedIndex].value;


     if (eindbest == ameer) {
            var distance = 13000 ; }

            else if (eindbest === groning) {
            var distance = 40000 ; }

            else if(eindbest === zwolle) {
            var distance = 600000 ;
            }


        if (vervoer === kuruma ) {
            var time = distance / 28 ;
        }

        else if (vervoer === jitensha) {
         var time = var distance / 4 ;

         }

         else if ( vervoer === densha) {
         var time = var distance / 56 ;

         }

         else if (vervoer === scoot) {
         var time = var distance / 8 ; }


    div2.innerHTML = "your travel time will be: <b>" + time + "</b>";

And this is my body

<form>
                    I live in <select id="woonplaats">
                    <option value="amstelveen">Amstelveen</option>
                    <option value="badhoevedorp">Badhoevedorp</option>
                </select>

                    <p></p>
                    I'll travel to <select id="bestemming">
                    <option value="ameer">Aalsmeer</option>
                    <option value="groning">Groningen</option>
                    <option value="zwol">Zwolle</option>

                </select> 

                <p></p>
                My vehicle is <select id="vervoer">
                    <option value="kuruma">Auto</option>
                    <option value="jitensha">Fiets</option>
                    <option value="scoot">Scooter</option>
                    <option value="densha">Trein</option>
                </select>

                    <p></p>

                    <p></p>
                   calculate time <input onclick="poel()" type="button" value="Bereken!">
                </form>

                <p>&nbsp;</p>

                 <div id="div2">your travel time will be.. gemiddelde  ... km/h</div>

Basically the idea is that the first and the second variable decide the distance between them, and the vehicle decides at which speed you'll travel, so it should calculate the travel time.

Answer 1

That's an immense amount of code for a relatively simple problem.

You should encode the distances as data tables instead of logic, and put the vehicle speeds directly into the form as the value attribute of the individual option elements:

The code below does the whole thing:

var distances = {
    amstelveen: {
        ameer: 14500,
        groning: 183000,
        einbest: 11400
    },
    badhoevedorp: {
        ameer: 13000,
        groning: 40000,
        zwolle: 600000
    }
};

document.getElementById('calculate').addEventListener('click', function () {
    var from = document.getElementById('woonplaats').value;
    var to = document.getElementById('bestemming').value;
    var speed = +document.getElementById('vervoer').value;

    var distance = distances[from][to];
    var time = distance / speed;
    document.getElementById('div2').innerHTML = "your travel time will be: <b>" + time + "</b>";
}, false);

Demo at http://jsfiddle.net/alnitak/cwdhbk2x/