Dynamische Tabelle mittels Checkbox

Könnte in etwa so aussehen:

Javascript:
<script language="javascript" type="text/javascript">
function berechnen() {
erg = 0;
html = "";

    for (a = 1; a <= 5; a++) {
        if (document.getElementsByName("check" + a)[0].checked == true) {
            erg = erg + parseFloat(document.getElementsByName("check" + a)[0].value);
            html = html + "<tr><td>" + document.getElementsByName("check" + a)[0].name + "</td><td>" + parseFloat(document.getElementsByName("check" + a)[0].value).toFixed(2) + "</td></tr>";
        }
    }

//Tabelle löschen
	document.getElementById("tabelle").innerHTML = "";
//und wenn mindestens eine Checkbox markiert wurde neu erstellen
	if (html != "") {
		html = html + "<tr><td width='200'></td><td width='200'></td></tr>";
		html = html + "<tr><td width='200'>Endsumme</td width='200'><td>" + erg.toFixed(2) +"</td></tr>";
	    html = "<table border='1'>" + html + "</table>";
		document.getElementById("tabelle").innerHTML = html;
	}

}
</script>
<input type="checkbox" name="check1" value="1" onclick="berechnen();" />
<br />
<input type="checkbox" name="check2" value="2" onclick="berechnen();" />
<br />
<input type="checkbox" name="check3" value="3" onclick="berechnen();" />
<br />
<input type="checkbox" name="check4" value="4" onclick="berechnen();" />
<br />
<input type="checkbox" name="check5" value="5" onclick="berechnen();" />
<br />
<p>Die Tabelle</p>
<div id="tabelle"></div>
 

Neue Beiträge

Zurück