Selectbox options toevoegen via for-lus

Status
Niet open voor verdere reacties.

gast0187

Gebruiker
Lid geworden
4 nov 2012
Berichten
266
Zoals het nu is geeft hij geen alert als je negatieve waarden ingeeft.
dit wil ik wijzigen:
Ik wil dat prijsvolw.obj.value maximum 6 en minimum 0
Ik wil dat prijskind.obj.value maximum 3 en minimum 0

Bvb: Anders bij de totaalberekening als je ingeeft aantal kinderen : -3 wordt er afgetrokken en er moet ook een beperking op zijn (zie hierboven)

Ik heb het zelf opgelost daar in plaats van tekstvak een selectbox met options te gebruiken.

Hoe kan je de selectbox options toevoegen via een for-lus?
Ik heb dat zo 2 keer nodig: 1e: van 0 tot 6, 2e van 0 tot 3

Een suggestie is steeds welkom!!!

Graag jullie hulp

Alvast op voorhand bedankt

Mvg gast0187
 
Laatst bewerkt:
Kan je misschien het javascript dat je al hebt even posten? Da's altijd handiger om te kunnen helpen ;-)
 
Dus ik wil dat de options van beide selectboxen via for-lus gebeuren:

Code:
<!DOCTYPE html>
<html>
    <head>
        <title>Vakantiehoeve/café</title>
        <meta name="Author" content="Antoon Verroken">
        <link href="CSS/style.css" rel="Stylesheet" type="text/css"/>
        <style>
            #reservatie{
                margin-left: 120px;
            }
            .links{
                float: left;
                width: 250px;
            }
            #totprijs{
                margin-top: 40px;
                letter-spacing: 2px;
                font-weight: bold;
                font-size: 18px;
            }
            #fotokosten{
                text-align: center;
                margin-top: 85px;
            }
            #IDbereken{
                padding: 5px;
                margin-top: 25px;
                width: 470px;
                text-align: center;
            }
            span{
                float: right;
                margin-right: 300px;
            }
        </style>
        <script>
            var basisweekend = 300;
            var basisweek = 500;
            var extravolweek = 20;
            var extravolweekend = 10;
            var kindweekend = 5;
            var kindweek = 10;
            var weekend;
            var week;
            var aantalvolw;
            var aantalkinderen;
            var bereken;
            var prijsbasis;
            var prijsvolw;
            var prijskind;
            var prijs;
            
            function initieer() {
                weekend = new getObj("IDbasisprijsweekend");
                week = new getObj("IDbasisprijsweek");
                aantalvolw = new getObj ("IDaantalvolw");
                aantalkinderen = new getObj("IDaantalkind");
                bereken = new getObj("IDbereken");
                prijsbasis = new getObj("IDprijsbasis");
                prijsvolw = new getObj("IDprijsvolw");
                prijskind = new getObj("IDprijskind");
                prijs = new getObj("IDprijs");
                bereken.obj.onclick = afdrukken;
            }
            function afdrukken(){
                    if ((weekend.obj.checked)){
                    prijsbasis.obj.innerHTML = "&euro;" + basisweekend;
                    prijsvolw.obj.innerHTML = "&euro;" + aantalvolw.obj.value * extravolweekend;
                    prijskind.obj.innerHTML = "&euro;" + aantalkinderen.obj.value * kindweekend;
                    var totprijs = parseInt(basisweekend) + parseInt(aantalvolw.obj.value * extravolweekend) + parseInt(aantalkinderen.obj.value * kindweekend);
                    prijs.obj.innerHTML = "&euro;" + totprijs;
                    } else if (week.obj.checked){
                            prijsbasis.obj.innerHTML = "&euro;" + basisweek;
                            prijsvolw.obj.innerHTML = "&euro;" + aantalvolw.obj.value * extravolweek;
                            prijskind.obj.innerHTML = "&euro;" + aantalkinderen.obj.value * kindweek;
                            var totprijs = parseInt(basisweek) + parseInt(aantalvolw.obj.value * extravolweek) + parseInt(aantalkinderen.obj.value * kindweek);
                            prijs.obj.innerHTML = "&euro;" + totprijs;
                        } else {
                            alert("Maak een keuze dat je voor een weekend of een week gaat.");
                        }
            }
            function getObj(name)
            {
              if (document.getElementById)
              {
                    this.obj = document.getElementById(name);
                    this.style = document.getElementById(name).style;
              }
              else if (document.all)
              {
                    this.obj = document.all[name];
                    this.style = document.all[name].style;
              }
              else if (document.layers)
              {
                    this.obj = document.layers[name];
                    this.style = document.layers[name];
              }
            }
        </script>
    </head>
    <body onload="initieer()">
        <div>
            <div>
                <h1 class="center">Hier kan je zien hoeveel de reservatie je zou kosten</h1>
            </div>
            <div id="reservatie">
                <div>
                    <label class="links">Basishuurprijs incluis 2 personen(volw) :</label>
                    <div class="rechts">
                        <input type="radio" id="IDbasisprijsweekend" name="basisprijs" />Per weekend
                        <input type="radio" id="IDbasisprijsweek" name="basisprijs" />Per Week (7)
                        &nbsp;&nbsp;<span id="IDprijsbasis"></span>
                    </div>
                </div>
                <div id="extravolwprijs">
                    <label class="links">Aantal extra volwassenen :</label>
                    <div class="rechts">
                         <select id="IDaantalvolw">
                             <option value="0" selected>0</option>
                             <option value="1">1</option>
                             <option value="2">2</option>
                             <option value="3">3</option>
                             <option value="4">4</option>
                             <option value="5">5</option>
                             <option value="6">6</option>
                         </select>
                         &nbsp;&nbsp;<span id="IDprijsvolw"></span>
                    </div>
                </div>
                <div>
                    <label class="links">Aantal kinderen onder de 12 jaar : </label>
                    <div class="rechts">
                        <select size="1" id="IDaantalkind">
                             <option value="0" selected>0</option>
                             <option value="1">1</option>
                             <option value="2">2</option>
                             <option value="3">3</option>                            
                         </select>
                        &nbsp;&nbsp;<span id="IDprijskind"></span>
                    </div>
                </div>
                <input type="button" id="IDbereken" value="Bereken prijs" class="center" onclick="afdrukken()"/>
                <div id="totprijs"><b><u>Totale prijs: </u></b><span id="IDprijs"></span></div>
            </div>
            <div id="fotokosten"><img src="image/kosten.png" /></div>
        </div>
    </body>
</html>

Alvast op voorhand bedankt.
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan