optellen id's door js.

[jan venema]

Ik heb een simpel script gemaakt dat er voor zorgt dat er een textarea verschijnt nadat de checkbox aangevinkt is.
in die textarea kan de klant een getal op geven wat vermenigvuldigt word met de value van de aangevinkte checkbox.
Deze gegevens worden daar onder weergegeven.
Het probleem is alleen dat bij 'id:total' alleen de waarde van alle aangevinkte checkboxes word opgeteld, en niet vermenigvuldigd met het getal wat in de textarea word aangegeven.

Is er een mogelijkheid dat de totalen van calzone, middel, groot, bij elkaar opgeteld kunnen worden en bij 'id:total' kunnen worden weergegeven, of dat de berekening doorgetrokken word naar 'id:total' ?

Alvast bedankt!

[JS]
if(!document.getElementById && document.all)
document.getElementById = function(id){ return document.all[id]}

var calzone = 0;
var middel = 0;
var groot = 0;
var total = 0;
function update(checkbox){
if(checkbox.checked){
total += parseFloat(checkbox.value);
} else {
total -= parseFloat(checkbox.value);
};
document.getElementById("total").innerHTML = "€ " + total.toFixed(2).replace(".", ",");
};

<!-- functie voor het verbergen van een element -->

function showHide (id)
{
var style = document.getElementById(id).style
if (style.visibility == "hidden")
style.visibility = "visible";
else
style.visibility = "hidden";
}
<!-- vermenigvuldigen -->

function multiply(value, multiplier, outputId) {
document.getElementById(outputId).innerHTML = "€ " + value * multiplier + ",-";

}
[/JS]

<tr><td><input type="checkbox" value="3" onclick="showHide('calzone1');update(this);"></input></td><td>€ 3,00</td>
<td>
<div id="calzone1" style="visibility: hidden;"> 
<input name="hoeveelheid" type="text" onkeyup="multiply(this.value, 3, 'calzone')" id="hoeveelheid" size="2" maxlength="2">
<label for="hoeveelheid">Maal</label></div>
</td></tr>

<tr><td><input type="checkbox" value="4.00" onclick="showHide('middel1');update(this);"></input></td><td>€ 4,00</td>
<td>
<div id="middel1" style="visibility: hidden;"> 
<input name="hoeveelheid" type="text" onkeyup="multiply(this.value, 4, 'middel')" id="hoeveelheid" size="2" maxlength="2">
<label for="hoeveelheid">Maal</label></div>
</td></tr>

<tr><td><input type="checkbox" value="5.00" onclick="showHide('groot1');update(this);"></input></td><td>€ 5,00</td>
<td>
<div id="groot1" style="visibility: hidden;"> 
<input name="hoeveelheid" type="text" onkeyup="multiply(this.value, 5, 'groot')" id="hoeveelheid" size="2" maxlength="2">
<label for="hoeveelheid">Maal</label></div>
</td></tr>

<!-- prijsbepaling -->

<tr><td></td><td><b>Calzone:</b></td><td id="calzone">€ 0,00</td></tr>
<tr><td></td><td><b>Middel:</b></td><td id="middel">€ 0,00</td></tr> 
<tr><td></td><td><b>Groot:</b></td><td id="groot">€ 0,00</td></tr>
<tr><td></td><td><b>Totaal:</b></td><td id="total">€ 0,00</td></tr>