Hallo,
Hallo, soweit habe ich den html code überarbeitet aber leider bekomme ich es nicht hin die 2 ergebnisse zusammen zu berechnen. also mein wunsch währe es das man anstatt 2 summen nur noch eine ist. hier der Code:
ich habe nun den ganzen Thread gelesen, und mir ist noch nicht klar geworden, was du nun eigentlich genau haben möchtest. Klar ist mir nur, dass der Code formal stark verbesserungswürdig ist - und zwar sowohl HTML, als auch JS.
<p>
<input name="dvd1" id="1" type="checkbox" value="29.951E0" onchange="aktualisieren()"> DVD1 - 29.95</p> <p>
<input name="dvd2" id="2" type="checkbox" value="21.951E0" onchange="aktualisieren()"> DVD2 - 21.95</p> <p>
<input name="dvd3" id="3" type="checkbox" value="9.951E0" onchange="aktualisieren()"> DVD3 - 9.95</p> <p>
<input name="dvd4" id="4" type="checkbox" value="12.951E0" onchange="aktualisieren()"> DVD4 - 12.95</p> <p>
<input name="dvd5" id="5" type="checkbox" value="79.951E0" onchange="aktualisieren()"> DVD5 - 79.95</p> <p>
<input name="dvd6" id="6" type="checkbox" value="29.951E0" onchange="aktualisieren()"> DVD6 - 29.95</p> <p>
<input name="dvd7" id="7" type="checkbox" value="49.951E0" onchange="aktualisieren()"> DVD7 - 49.95</p> <p>
<input name="dvd8" id="8" type="checkbox" value="29.951E0" onchange="aktualisieren()"> DVD8 - 29.95</p> <p>
Das Absatzende </p> am Ende einer Quelltext-Zeile zu notieren, ist durchaus üblich. Den Beginn des neuen Absatzes aber auch noch am Zeilenende zu notieren, ist zumindest sehr ungewöhnlich, wenn auch nicht verboten.
Aber sind Formulardelder Absätze? Nein, nicht wirklich. Zur Gliederung eines Formulars ist eigentlich das [fieldset-Element](http://de.selfhtml.org/html/formulare/strukturieren.htm#gruppieren) gedacht, die einzelnen Checkboxen packt man mitsamt ihrer Beschriftung in [label-Elemente](http://de.selfhtml.org/html/formulare/strukturieren.htm#label). Damit ist die Zuordnung von Label zur Checkbox eindeutig, und der Benutzer hat den Vorteil, dass er nicht unbedingt auf das kleine Käschtl klicken muss, sondern wahlweise auch auf den Text. Wenn jede Checkbox in einer eigenen Zeile stehen soll, erreicht man das mit display:block; für die label-Elemente.
Beachte, dass zusätzlich zu der in SELFHTML angegebenen Syntax für label auch eine alternative Form möglich ist:
[code=html]<label><input ...> Text Text Text</label>[/code]
Das finde ich von der Gliederung her schlauer, weil die Beziehung nicht durch ein ID-Attribut hergestellt wird, sondern über die Dokumentstruktur.
Warum gibst du die Preise im value-Attribut konsequent in wissenschaftlicher Schreibweise (Exponentialschreibweise) an? Und noch dazu alle um einen Zehntel-Cent teurer als im Text genannt? Also das erste Beispiel 29.95 laut Text, aber 29.951 laut Attribut?
Welche HTML-Variante verwendest du? In XHTML sowie HTML 4.01 sind IDs, die mit einer Ziffer beginnen (oder nur aus Ziffern bestehen), nicht erlaubt. IMO brauchst du aber bei diesen Elementen gar keine ID, und wenn du allen denselben Namen gibst (also durchgehend name="dvd"), kannst du bequem darüber iterieren.
> `<span style="font-size:32px;"><b>Versandart</b></span></p> <p>`{:.language-html}
Das sieht doch sehr nach einer Zwischenüberschrift aus, als wäre hier anstatt des nichtssagenden span-Containers in einem p-Element ein hx-Element niedriger Ordnung angebracht. Würde sowohl p als auch span sinnvoll ersetzen.
> `<input checked="checked" value="0.00E0" type="radio" name="form[bearbeitung]" id="9" onchange="aktualisieren()"> Standart (5-10 Werktage)</p> <p>`{:.language-html}
"Standard" im Sinne von "Regel" schrieb sich noch nie mit 't' am Schluss. Und: Warum wählst du einen so komplizierten Namen für das Feld? Brauchst du den so in der nachfolgenden serverseitigen Auswertung?
> ~~~html
<select name="Grösse" onchange="rechne(this.value);">
> <option value="" selected="">Bitte auswhälen</option>
> <option value="1">USB 2 GB 15€</option>
> <option value="2">USB 4 GB 20€</option>
> <option value="3">USB 8 GB 30€</option>
> <option value="4">USB 16 GB 40€</option>
> <option value="5">USB 32 GB 50€</option>
> </select>
Vorschlag: Schreib den Preis auch hier direkt ins value-Attribut, dann brauchst du in der Funktion rechne() nicht nochmal abstrakte Nummern und konkrete Preise einander zuzuordnen.
<p></p><p></p>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Bestellformular</title>
Über die Sinnlosigkeit leerer Absätze hat sich ja schon jemand anders ausgelassen, ebenso darüber, dass ein meta-Element sowie der Dokumententitel nicht mitten im body vorkommen können.
> ~~~html
<script language="JavaScript">
> <!--
Das language-Attribut im script-Element war noch nie nötig, unter Umständen ist es sogar falsch. Erforderlich ist stattdessen eventuell das type-Attribut. Und den nachfolgenden Javascript-Code in einen HTML-Kommentar zu stecken, ist ein Relikt aus der Zeit, als noch nicht alle Browser wussten, was <script> bedeutet. Weg damit.
function aktualisieren() {
var gespreis = 0;
var wert = 0;
for (var i = 1; i <= 10; i++) {
if (document.getElementById(i).checked) {
wert = parseFloat(document.getElementById(i).value);
wert = wert*100;
gespreis += parseInt(wert);
}
}
gespreis = parseFloat(gespreis);
gespreis = gespreis/100;
document.getElementById('preis').value = gespreis;
}
Immerhin ist dir bewusst, dass bei der Rechnung mit gebrochenen Zahlen Rundungsfehler auftreten können, und führst die eigentliche Addition daher mit Integerwerten durch. Aber warum setzt du nicht gleich Integerwerte in die value-Attribute der Formularelemente? Dann könntest du dir hier die ganze Hin- und Herwandlung sparen und müsstest nur einmal umwandeln - nämlich bei der endgültigen Ausgabe ins Formularfeld.
Übrigens hast du hier noch einen Schönheitsfehler: Wenn der errechnete Gesamtbetrag nur eine oder überhaupt keine Nachkommastelle braucht, wird er auch so ausgeschrieben. Dann steht im Formularfeld beispielsweise "15.9" drin. Abhilfe schafft eine explizite Umwandlung in String mit [toFixed()](http://de.selfhtml.org/javascript/objekte/number.htm#to_fixed).
> ~~~javascript
function rechne(option)
> {
> var output= 0
> if (option == 1) { output = 15;}
> if (option == 2) { output = 20;}
> if (option == 3) { output = 30;}
> if (option == 4) { output = 40;}
> if (option == 5) { output = 50;}
>
> document.getElementById('output').value = output;
> }
Siehe oben. ;-)
So, und jetzt formuliere bitte nochmal genau, was du eigentlich als Ausgabe haben möchtest. Dann sehen wir weiter.
So long,
Martin
--
Man ist so alt, wie man sich fühlt.
Aber niemals so wichtig.
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(