Paul: Checkbox Zahlen addieren

Nabend zusammen!

Ich habe da so ein kleines Problem. Ich habe demnächst eine Veranstaltung, zu der wir unteranderem ein Onlinanmeldeformular erstellen wollen. Ich habe mich dessen angenommen, obwohl ich nicht wirklich das bin, was man versiert nennt. Bei googlemail gibt es so ein vorgefertigtes Formular. Für simple Dinge eigentlich ganz gut geeignet wie ich finde und außerdem kann man da so ein Form erstellen und dann werden die Anmeldungen automatisch in ein Excelsheet eingetragen. Lange Rede kurzer Sinn, ich habe das für mich angepasst, habe also ein Mischung gemacht, damit ich die Tabelle benutzen kann aber gleichzeitg meine eigenen Dinge geschrieben. Jetzt habe ich aber ein Problem. Während dieser Veranstaltung sollen mehrere kleinere Veranstaltungen statt finden, die einem das Leben schön machen. Dafür verlangen wir ein bisschen Geld. Ich habe das jetzt so gelöst, dass ich eine Tabelle erstellt habe und dort kann sich jeder mit seinem Namen eintragen und Haken an die Checkboxen machen zu welcher Veranstaltung er / sie kommen mag. Jede Veranstaltung kostet jedoch Geld und ich würde das gerne automatisch ausrechnen lassen. Sprich wenn man einen Haken an eine Box macht soll das automatisch addiert werden. Ist das möglich ? Ich habe ziemlich lange für praktisch Nichts gebraucht, weil es mir einfach nicht gelungen ist. Ich bin mir nicht sicher, ob ich PHP zur Verfügung habe, deswegen wäre eine JavaScript Lösung am optimalsten.

Hier mal mein Ansatz: Ich bin mir nicht mal sicher, ob der auch so richtig ist.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Stiftungsfest 2009 Online Anmeldung</title>




</head>

<body bgcolor="#C0C0C0" text="#000000" link="#000000" vlink="#000000" alink="#000000">






<p>
<div align="center">
<table  width="60%" border="1" cellspacing="0" cellpadding="4" >
	<tr>
		<td bgcolor="#ffFFFF">
<form action="http://spreadsheets.google.com/formResponse?formkey=cEVsOEVXZWozc0pSNzZrQnVUSnYtTGc6MA.." method="POST">

<p style="text-align:left; margin-left:50px; margin-right:50px">
Online Anmeldung für das Stiftungsfest 2009<br>
Daten: vom xx - yyy</p><p>
<p>

<p style="text-align:left; margin-left:25px; margin-right:0px">
<table  width="100%" border="1" cellspacing="0" cellpadding="4">
	<tr>
		<!-- Row 1 Column 1 -->
		<td >
			
		</td>
		<!-- Row 1 Column 2 -->
		<td >
			Kolloquium (0,00€)
		</td>
		<!-- Row 1 Column 3 -->
		<td >
			Begrüssungsabend (15,00€)
		</td>
		<!-- Row 1 Column 4 -->
		<td >
			Convente (0,00€)
		</td>
		<!-- Row 1 Column 5 -->
		<td >
			Damenprogramm (10,00€)
		</td>
		<td >
			Mittagessen (10,00€)
		</td>
		<!-- Row 1 Column 6 -->
		<td >
			Festball (40,00€)
		</td>
		<!-- Row 1 Column 7 -->
		<td >
			Ausklang (15,00€)
		</td>
	</tr>
	<tr><label class="ss-q-help" for="entry_4"></label>
		<!-- Row 2 Column 1 -->
		<td >
			<label class="ss-q-title" for="entry_3">1.<input type="text" name="entry.3.single" value="" class="ss-q-short" id="entry_3" size="30" maxlength="30">
		</td>
		<!-- Row 2 Column 2 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Kolloqium" class="ss-form-input" id="group_4_1">
<label for="group_4_1"></label>
		</td>
		<!-- Row 2 Column 3 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Begrüssungsabend" class="ss-form-input" id="group_4_2">
<label for="group_4_2"></label>
		</td>
		<!-- Row 2 Column 4 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Convente" class="ss-form-input" id="group_4_3">
<label for="group_4_3"></label>
		</td>
		<!-- Row 2 Column 5 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Damenprogramm" class="ss-form-input" id="group_4_4">
<label for="group_4_4"></label>
		</td>
		<td >
			<input type="checkbox" name="entry.4.group" value="Mittagessen" class="ss-form-input" id="group_4_5">
<label for="group_4_5"></label>
		</td>
		<!-- Row 2 Column 6 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Festball" class="ss-form-input" id="group_4_6">
<label for="group_4_6"></label>
		</td>
		<!-- Row 2 Column 7 -->
		<td >
			<input type="checkbox" name="entry.4.group" value="Ausklang" class="ss-form-input" id="group_4_7">
<label for="group_4_7"></label>
		</td>
	</tr>
	<tr>
		<!-- Row 3 Column 1 -->
		<td >
			<label class="ss-q-title" for="entry_5">2.<input type="text" name="entry.5.single" value="" class="ss-q-short" id="entry_5" size="30" maxlength="30">
		</td>
		<!-- Row 3 Column 2 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Kolloqium" class="ss-form-input" id="group_6_1">
<label for="group_6_1"></label>
		</td>
		<!-- Row 3 Column 3 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Begr&uuml;ssungsabend" class="ss-form-input" id="group_6_2">
<label for="group_6_2"></label>
		</td>
		<!-- Row 3 Column 4 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Convente" class="ss-form-input" id="group_6_3">
<label for="group_6_3"></label>
		</td>
		<!-- Row 3 Column 5 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Damenprogramm" class="ss-form-input" id="group_6_4">
<label for="group_6_4"></label>
		</td>
		<td >
			<input type="checkbox" name="entry.6.group" value="Mittagessen" class="ss-form-input" id="group_6_5">
<label for="group_6_5"></label>
		</td>
		<!-- Row 3 Column 6 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Festball" class="ss-form-input" id="group_6_6">
<label for="group_6_6"></label>
		</td>
		<!-- Row 3 Column 7 -->
		<td >
			<input type="checkbox" name="entry.6.group" value="Ausklang" class="ss-form-input" id="group_6_7">
<label for="group_6_7"></label>
		</td>
	</tr>
	<tr>
		<!-- Row 4 Column 1 -->
		<td >
			<label class="ss-q-title" for="entry_7">3.<input type="text" name="entry.7.single" value="" class="ss-q-short" id="entry_7" size="30" maxlength="30">
		</td>
		<!-- Row 4 Column 2 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Kolloquium" class="ss-form-input" id="group_8_1">
<label for="group_8_1"></label>
		</td>
		<!-- Row 4 Column 3 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Begr&uuml;ssungsabend" class="ss-form-input" id="group_8_2">
<label for="group_8_2"></label>
		</td>
		<!-- Row 4 Column 4 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Convente" class="ss-form-input" id="group_8_3">
<label for="group_8_3"></label>
		</td>
		<!-- Row 4 Column 5 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Damenprogramm" class="ss-form-input" id="group_8_4">
<label for="group_8_4"></label>
		</td>
		<td >
			<input type="checkbox" name="entry.8.group" value="Mittagessen" class="ss-form-input" id="group_8_5">
<label for="group_8_5"></label>
		</td>
		<!-- Row 4 Column 6 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Festball" class="ss-form-input" id="group_8_6">
<label for="group_8_6"></label>
		</td>
		<!-- Row 4 Column 7 -->
		<td >
			<input type="checkbox" name="entry.8.group" value="Ausklang" class="ss-form-input" id="group_8_7">
<label for="group_8_7"></label>
		</td>

	</tr>
	<tr>
		<!-- Row 5 Column 1 -->
		<td >
			<label class="ss-q-title" for="entry_9">4.<input type="text" name="entry.9.single" value="" class="ss-q-short" id="entry_9" size="30" maxlength="30">
		</td>
		<!-- Row 5 Column 2 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Kolloquium" class="ss-form-input" id="group_10_1">
<label for="group_10_1"></label>
		</td>
		<!-- Row 5 Column 3 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Begr&uuml;ssungsabend" class="ss-form-input" id="group_10_2">
<label for="group_10_2"></label>
		</td>
		<!-- Row 5 Column 4 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Convente" class="ss-form-input" id="group_10_3">
<label for="group_10_3"></label>
		</td>
		<!-- Row 5 Column 5 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Damenprogramm" class="ss-form-input" id="group_10_4">
<label for="group_10_4"></label>
		</td>
		<td >
			<input type="checkbox" name="entry.10.group" value="Mittagessen" class="ss-form-input" id="group_10_5">
<label for="group_10_5"></label>
		</td>
		<!-- Row 5 Column 6 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Festball" class="ss-form-input" id="group_10_6">
<label for="group_10_6"></label>
		</td>
		<!-- Row 5 Column 7 -->
		<td >
			<input type="checkbox" name="entry.10.group" value="Ausklang" class="ss-form-input" id="group_10_7">
<label for="group_10_7"></label>

		</td>

	</tr>
	<tr>
		<!-- Row 6 Column 1 -->
		<td >
			<label class="ss-q-title" for="entry_11">5.<input type="text" name="entry.11.single" value="" class="ss-q-short" id="entry_11" size="30" maxlength="30">
		</td>
		<!-- Row 6 Column 2 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Kolloquium" class="ss-form-input" id="group_12_1">
<label for="group_12_1"></label>
		</td>
		<!-- Row 6 Column 3 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Begr&uuml;ssungsabend" class="ss-form-input" id="group_12_2">
<label for="group_12_2"></label>
		</td>
		<!-- Row 6 Column 4 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Convente" class="ss-form-input" id="group_12_3">
<label for="group_12_3"></label>
		</td>
		<!-- Row 6 Column 5 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Damenprogramm" class="ss-form-input" id="group_12_4">
<label for="group_12_4"></label>
		</td>
		<td >
			<input type="checkbox" name="entry.12.group" value="Mittagessen" class="ss-form-input" id="group_12_5">
<label for="group_12_5"></label>
		</td>
		<!-- Row 6 Column 6 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Festball" class="ss-form-input" id="group_12_6">
<label for="group_12_6"></label>
		</td>
		<!-- Row 6 Column 7 -->
		<td >
			<input type="checkbox" name="entry.12.group" value="Ausklang" class="ss-form-input" id="group_12_7">
<label for="group_12_7"></label>
		</td>

	</tr>
</table>





<p style="text-align:left; margin-left:50px; margin-right:50px">
<label class="ss-q-title" for="entry_13">Anmerkungen</label><br>
<label class="ss-q-help" for="entry_13">Bitte hier Wünsche, Anmerkungen etc. eintragen</label><br>
<textarea name="entry.13.single" rows="8" cols="75" class="ss-q-long" id="entry_13"></textarea>
<p>
<div align="center"><input type="submit" value="Senden"></div>


</form>
<p>
	</td>
	</tr>
</table>
</div>

</body>

</html>

Wäre super, wenn mir da jemand helfen könnte.

  1. hallo,

    Wäre super, wenn mir da jemand helfen könnte.

    beseitige am besten erstmal die fehler im markup mit hilfe von http://validator.w3.org/

  2. Ich habe da so ein kleines Problem.

    Das ist schlecht, aber wie lautet deine JS Frage?

    Struppi.