Druckversion des Themas

Hier klicken um das Topic im Orginalformat anzusehen

HTML-Editor phase 5 Support _ HTML _ Berechnung mit JS und checkboxen

Geschrieben von: Sus90 13.03.2010 - 0:06

Hallo:) ich möchte eine Berechnung erstellen, in welcher Kunden zwischen verschiedenen Behandlungen und Produkten wählen können. Dies soll mit Hilfe von Checkboxen gelingen. Ich weiß jetzt nur nicht, wie ich es hinbekomme, das nur die Preise zusammengerechnet werden, welche ausgewählt (Checkbox) sind... Kann mir da jemand helfen?

Ich stell zum besserem Verständnis/ Vorstellung den Quellencode mit rein (es können gern Veränderungen daran vorgenommen werden, z.B. eine andere Bezeichnung für die Checkboxen, denn ich denke, dass da schon mein Fehler drin steckt), bitte nicht von den vielen <font color> irritieren lassen, ich weiß, da gibt es auch noch andere Möglichkeiten, aber mir geht es erstmal um die Rechnung:

<html>

<head>

<title>start</title>

<meta name="…" content="…">

<script language="JavaScript">



</script>

<noscript></noscript>

</head>

<body text="#FFFFFF" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">

<div id="box3">

<table cellpadding="20" cellspacing="1">

<tr>

<td> …. <br><br>

<form name="berechnung">

<div align="center"><table border="1" cellpadding="20" cellspacing="1">

<tr>

<td> <font color="#000000"> Ihre gewünschte <b>Behandlung</b>:<br>(Praxisleistung)</font> </td>

<td><font color="#008080"><ul type="square">

<li> med. Fußpflege </li><br>

<li>Behandlung eingewachsener Fußnägel</li><br>

<li>Fuß- & Unterschenkelmassage</li><br>

<li>Reflexzonenmassage</font></li>

</ul></font></td>

<td><font color="#000000">

<input type="Checkbox" name="behandlung" value="mF"> 11.50 EUR<br><br>

<input type="Checkbox" name="behandlung" value="eFN"><font color="#FFFFFF">0</font> 9.00 EUR<br><br>

<input type="Checkbox" name="behandlung" value="F&Um"> 20.00 EUR<br><br>

<input type="Checkbox" name="behandlung" value="eFN">18.00 EUR</font></td>

</tr>

<tr>

<td> <font color="#000000"> <b>Gutschein:</b></font></td>

<td> <font color="#008080"><ul type="square">

<li> Gutschein 1</li><br>

<li> Gutschein 2</li><br>

<li> Gutschein 3</li></ul>

</font></td>

<td> <font color="#000000">

<input type="Checkbox" name="gutschein" value="G1"> 11.50 EUR<br><br>

<input type="Checkbox" name="gutschein" value="G2"><font color="#FFFFFF">0</font>14.50 EUR<br><br>

<input type="Checkbox" name="gutschein" value="G3"> 18.00 EUR</font></td>

</tr>

<tr>

<td> <font color="#000000"> <b>Produkte:</b></font></td>

<td> <font color="#008080"><ul type="square">

<li>Fusskraft <font color="#0000FF">BLAU</font> (75 ml)</li><br><br>

<li>Fusskraft <font color="#0000FF">BLAU</font> (125 ml)</li><br><br>

<li>Fusskraft <font color="#007F00"> GRÜN</font> (75 ml)</li><br><br>

<li>Fusskraft <font color="#007F00"> GRÜN</font> (125 ml)</li><br><br>

<li>Fusskraft <font color="#DF0000"> ROT</font> (75 ml)</li><br><br>

<li>Fusskraft <font color="#DF0000"> ROT</font> (125 ml)</li><br><br>

<li>Fusskraft <font color="#007F00"> Kräuterlotion</font> (150 ml)</li><br><br>

<li>Fusskraft <font color="#007F00">Nagel- und Hautschutz-Spray</font> (50 ml)</li><br><br>

<li>Fusskraft <font color="#007F00">Pflegespray</font> (150 ml)</li><br><br>

<li>Fusskraft <font color="#007F00">Bambus-Peeling</font> (150 ml)</li><br><br>

<li>Fusskraft <font color="#007F00">Kräuterbad</font> (250 g)</li><br><br>

<li>Fusskraft <font color="#FF0000">Wärmebad-Konzentrat</font> (150 ml)</li><br><br>

<li>Fusskraft <font color="#00A0FF">Zehenschutzring G </font> (2 Stück) </li><br><br>

<li>Fusskraft <font color="#00A0FF">Zehenschutzring G </font> (4 Stück)</li></ul>

</font></td>

<td> <font color="#000000">

<input type="Checkbox" name="produkte" value="p1"> <font color="#FFFFFF">0</font>6.25 EUR<br><br>

<input type="Checkbox" name="produkte" value="p2"> <font color="#FFFFFF">0</font>7.95 EUR<br><br>

<input type="Checkbox" name="produkte" value="p3"> <font color="#FFFFFF">0</font>6.25 EUR<br><br>

<input type="Checkbox" name="produkte" value="p4"> <font color="#FFFFFF">0</font>7.95 EUR<br><br>

<input type="Checkbox" name="produkte" value="p5"> <font color="#FFFFFF">0</font>6.25 EUR<br><br>

<input type="Checkbox" name="produkte" value="p6"> <font color="#FFFFFF">0</font>7.95 EUR<br><br>

<input type="Checkbox" name="produkte" value="p7"> <font color="#FFFFFF">0</font>7.95 EUR<br><br>

<input type="Checkbox" name="produkte" value="p8"> <font color="#FFFFFF">0</font>5.25 EUR<br><br>

<input type="Checkbox" name="produkte" value="p9"> <font color="#FFFFFF">0</font>7.95 EUR<br><br>

<input type="Checkbox" name="produkte" value="p10"> 11.90 EUR<br><br>

<input type="Checkbox" name="produkte" value="p11"> <font color="#FFFFFF">0</font>5.55 EUR<br><br>

<input type="Checkbox" name="produkte" value="p12"> 10.80 EUR<br><br>

<input type="Checkbox" name="produkte" value="p13"> <font color="#FFFFFF">0</font>4.20 EUR<br><br>

<input type="Checkbox" name="produkte" value="p14"> <font color="#FFFFFF">0</font>7.90 EUR</font></td>

</tr>

<tr>

<td><div align="center"><font color="#000000"> <input type="Button" name="" value="Gesamtpreis berechnen!" onClick="rechner()"><br><br><br><br>

<input type="reset" value="Lösche!"></font></div></td>

<td> <font color="#000000"> <div align="right">Summe <font size="2">(mit Mwst):</font></div><br>

<div align="right">darin enthaltene Mwst:</div></font></td>

<td> <font color="#000000"> <input type="Text" name="summe" readonly value="" size="" maxlength=""><br><br>

<input type="Text" name="mwst" readonly value="" size="" maxlength=""></font></td>

</tr>

</table>

</form>

</div>

</body>

</html>

Geschrieben von: Thomas 14.03.2010 - 13:49

Leider fehlt mir momentan die Zeit, um dir das auszuarbeiten. Und die bisherige Vorarbeit ist leider auch nicht sehr ausführlich, so dass noch einiges zu tun ist. Deshalb hier ein paar grundsätzliche Tipps auf die Schnelle, mit denen du dir eventuell selbst eine Lösung erarbeiten kannst:

Viele nützliche Tipps zur Auswertung von Formularen mit JS findest du bei http://de.selfhtml.org/javascript/objekte/elements.htm.

Momentan haben deine Checkboxen als Werte (Attribut "value") abstrakte Bezeichner( "mF", "G1", "p1"). Insofern wird es etwas schwierig, zu einer angeklickten Checkbox den zugeordneten Preis festzustellen. Du müsstest also in JS eine zusätzliche Zuordnung der Bezeichner zu den Preisen definieren (das müsste über Arrays gehen), um es einfach zu halten - oder aber die Preise auch in den Werten einschließen.

Ich an deiner Stelle würde so anfangen: Bau dir ein Formular ohne Schnickschnack mit zwei Checkboxen und einem Button. Programmiere eine Funktion, die dir beim Anklicken des Buttons den Wert der angeklickten Checkbox(en) anzeigt. Von da arbeite dich dann weiter vor. Falls dabei Fragen auftreten, kannst du diese gerne hier stellen.

Geschrieben von: Sus90 15.03.2010 - 19:25

Danke Thomas für deine Rückmeldung:)

Ich hab das Formular und die ganzen Ceckboxen nochmal überarbeitet und umstrukturiert und hab es hinbekommen (mit Hilfe eines Freundes).
Danke dir, das du trotz Stress drüber geschaut hast und mir Tipps gegeben hast!

Liebe Grüße, Susann.

Geschrieben von: El-grecko 31.08.2010 - 14:05

Unterstützt von Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)