vendredi 24 juin 2016

Jquery, for loop shows all

$("#button").click(function () {
    var pp = []
    var ing = []

    for (var q = 1; q <= 6; q++) {
        pp[q - 1] = $('input[name=P' + (q) + ']').is(":checked");
        ing[q - 1] = $('div#ingp' + (q) + '').show();
    }

    for (var q = 1; q <= 6; q++) {
        if (pp[q - 1] == true) {
            ing[q - 1];
        }
    }
});

<div class="Pizzas container" id="checkbox_pizza">
    <h1>Kies uw Pizza.</h1>
    <form id="Pi">
        <input type="checkbox" name="P1" id="g"> &euro;6,00 -Margherita (Kaas en tomaten)
        <br/>
        <input type="checkbox" name="P2" id="h"> &euro;7,20 -Napolitana (tomaten, kaas, kappertjes, ansjovis)
        <br/>
        <input type="checkbox" name="P3" id="i"> &euro;7,50 -Salami (kaas, tomaten en salami)
        <br/>
        <input type="checkbox" name="P4" id="j"> &euro;7,50 -Prosciutto (tomaten, kaas, ham)
        <br/>
        <input type="checkbox" name="P5" id="k"> &euro;7,00 -Funghi (tomaten, kaas, champions)
        <br/>
        <input type="checkbox" name="P6" id="l"> &euro;8,00 -Tonno (tomaten, kaas, tonijn, ui)
        <br/>
        <input type="button" id="knop" value="button" />
    </form>
</div>

<div class="container" id="Boxx">
    <div id="ingrediënten">
        <div>
            <h1>Kies extra ingredienten</h1>
        </div>
        <div id="ingp1"></div>
        <div id="ingp2"></div>
        <div id="ingp3"></div>
        <div id="ingp4"></div>
        <div id="ingp5"></div>
        <div id="ingp6"></div>
        <input type="button" id="knop2" value="Totaal" />
    </div>
</div>

So the problem I have is that when I look if one or more of P1 to P6 is check then it shows all 6 div with id ingp1 to ingp6. I want it to show ingp1 when P1 is checked, and ingp3 when P3 is checked. You get it. How do I do this (small thing I am only allowed to use javascript and jquery).




Aucun commentaire:

Enregistrer un commentaire