ImNewToThis ImNewToThis - 5 months ago 16
HTML Question

Use same values from array in different drop down menus

I'm making this hotel booking

form
, or atleast trying to make it work.
But on my road to complete that goal, I've encountered a couple of problems.
I got two different
drop-down menu's
that I want to retrive info from the same
array
, as both will contain the same information.

If anything that I've said seems unclear or to broad, please ask before complaining and I will do my best to explain.

EDIT: The two menus I'm talking about are the two with the value "selectRom".

<html>
<head>
<meta charset="UTF-8">
<style>

</style>

<title>

</title>

</head>

<body>


<div>
<select id="selectNumber">
<option>Velg ett sted</option>
</select>
<input type="date">
<input type="number">
<br><select id="selectRom">
<option>Antall singel rom</option>
</select>

<br> <select id="selectRom">
<option>Antall singel rom</option>
</select>
<br>Skipass:<input type="checkbox" id="skiPass">
<br>Skiutstyr:<input type="checkbox" id="skiUtstyr">




</div>

<script>
var select = document.getElementById("selectNumber");
var options = ["Konsberg", "Trysil", "Beitostølen"];
for(var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}
var select = document.getElementById("selectRom");
var options = ["1", "2", "3"];
for(var i = 0; i < options.length; i++) {
var opt = options[i];
var el = document.createElement("option");
el.textContent = opt;
el.value = opt;
select.appendChild(el);
}

</script>
</body>
</html>


Aditional question, not related to main question, if anyone know how to make this entire thing into a calculator, calculating depending on what info is typed in, I would be greatful if anyone would be kind enough to explain or try to teach me.
JSFIDDLE:
https://jsfiddle.net/wa1fyLa7/

Answer

https://jsfiddle.net/wa1fyLa7/5/

Note :please dont use the same id for multiple times.

<body>


    <div>
    <select id="selectNumber">
    <option>Velg ett sted</option>
    </select>
    <input type="date">
    <input type="number">
    <br><select id="selectRom">
    <option>Antall singel rom</option>
    </select>

    <br>    <select id="selectRom2">
    <option>Antall singel rom</option>
    </select>
    <br>Skipass:<input type="checkbox" id="skiPass">
    <br>Skiutstyr:<input type="checkbox" id="skiUtstyr">




    </div>

    <script>
    var select = document.getElementById("selectNumber");
    var options = ["Konsberg", "Trysil", "Beitostølen"];
    for(var i = 0; i < options.length; i++) {
    var opt = options[i];
    var el = document.createElement("option");
    el.textContent = opt;
    el.value = opt;
    select.appendChild(el);
    }
    var select = document.getElementById("selectRom");  
  var select2 = document.getElementById("selectRom2");
    var options = ["1", "2", "3"];
    for(var i = 0; i < options.length; i++) {
    var opt = options[i];
    var el = document.createElement("option");
    el.textContent = opt;
    el.value = opt;
     var el2 = document.createElement("option");
    el2.textContent = opt;
    el2.value = opt;
    select.appendChild(el);
    select2.appendChild(el2);
    }   

    </script>
    </body>
Comments