cubataxi: Rechnen / Formel/ Beispiel 2+2=4

Hallo, bin neu und hoffe es kann mir einer helfen und licht ins dunkle mir bringen. Also, habe mir gewagt, auszuprobieren einen eigenen Preisrechner zu gestalten. Bis zum Gestalten bin ich gekommen, aber wie verknüpfe ich die html das dieser auch rechnet!
Soll mal so funktionieren das er selbstständig nach Eingabe aller Kreterin einen preis ausspuckt! Habe schon viel ausprobiert, andere Programme mir angesehen, leider fehlt mir der durchblick. Ich hoffe so, das mir nur einer zeigt, an einem einfachen Beispiel, wie 2+2=4 wie ich dieses Problem lösen kann. Ich gebe euch mal den link und ihr könnt mal über einen Anfänger lachen, hoffe aber ihr könnt mir helfen, das ich es auch verstehe. Die Maske habe ich soweit fertig, aber schaut selber-

http://www.cubataxi.de/index5.html

Angefangen von der plz 15370 nach unten und nach oben, (Entfernung) 1,1-1.2-1,3 proportional( %) erhöhen. Dann % tual erhöhen (Arbeitsaufwand) * Gesamtmeter= netto bzw.+ 19% bzw. -3%  Skonto. Ich hoffe es ist verständlich was ich meine.

Danke schon jetzt für eure Hilfe!
--------------------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<meta content="Heckenschnitt,Gartenarbeiten,Angebote,Preisrechner,Heckenpflanzen,Schnitt,Blütenpflanzen,Freiwachsende,Hecken,Nadelhecke,Laubhecke,Schnittmaßnahmen,Fachbetrieb,Baumschule,Gärtnerei,Baumschule,Dienstleistungen," name="keywords" />
<meta content="http://www.cubataxi.de/index5.html" name="andie" />
<script src="http://www.cubataxi.de.js" type="text/javascript"></script>
<script type="text/javascript">
if (window.vn_sas_add2tag) vn_sas_add2tag=vn_sas_add2tag+';'+' vnmsubpaswf0';
else vn_sas_add2tag=' vnmsubpaswf0';
</script>
<!-- #BeginEditable "doctitle" -->
<title>Heckenschnitt | Preisrechner</title>
<!-- #EndEditable -->

</head></html><head>
<style type="text/css">

.auto-style1 {
font-size: large;
}
</style>
</head>

<html>

<body id="top" style="height: 1132px">

<script src="http://www.cubataxi.de.js" type="text/javascript"></script>
<!-- wrappertop -->
<div id="wrappercontent">
<div id="wrapperspalten">
<div id="content">
<form action="http://www.cubataxi.de/index5.html" method="post" name="form1" onsubmit="return calculateText();">
<h1 class="auto-style1">Angebotsrechner für Heckenschnitt/ Freiwachsende
Blütensträucher</h1>
<br />
<fieldset>
<p><strong>0. meine PLZ?</strong></p>
<p>&nbsp;<!-- #BeginEditable "PLZ" --><textarea name="plz3" style="width: 50px; height: 21px">15370
</textarea><!-- #EndEditable --> </p>
<p><span class="auto-style2"><strong>1. meine Hecke/Pflanze ist
eine?</strong></span></p>
<p><select name="ordner0" size="1">
<option selected="" value="1">Laubhecke/pflanze</option>
<option value="1,3">Nadelheck/pflanze</option>
<option value="2">Freiwachsende Hecke</option>
<option value="2">Blütenpflanze-Strauch</option>
</select> &nbsp;</p>
<p class="auto-style2"><strong>2. die Hecke/Pflanze ist ca. vor
1-20 gepflanzt worden?</strong></p>
<p>
<input name="_1P" onclick="calculateeins();" type="checkbox" value="1" />
vor 1-5 jahren</p>
<p>
<input name="_5P2" onclick="calculatefünf();" type="checkbox" value="1,3" />
vor 5-10 jahren</p>
<p>
<input name="_10P3" onclick="calculatezehn();" style="height: 20px" type="checkbox" value="1,7" />vor
10-20 jahren</p>
<p>
<input name="_20P4" onclick="calculatezwanzig();" style="height: 20px" type="checkbox" value="2" />
vor über 20 jahren &lt; &nbsp;/p&gt; </p>
<p class="auto-style2"><strong>3. die Hecke/ Pflanze wurde</strong></p>
<p>
<input name="nochnieP5" onclick="calculatenochnie();" type="checkbox" value="2" />noch
nie geschnitten </p>
<p>
<input name="jährlichP6" onclick="calculatejährlich();" type="checkbox" value="1" />jährlich/regelmäßig
geschnitten </p>
<p><span class="auto-style2"><strong>4. Schnittgutberäumenung</strong></span>
</p>
<p>
<input name="schnittgutjaP7" onclick="calculateschnittgutja();" type="checkbox" value="1,5" /><strong>Ja,
</strong>ich möchte das Schnittgut beräumt haben</p>
<p>
<input name="schnittgutneinP0" onclick="calculateschnittguntein();" type="checkbox" value="1" /><strong>Nein,
</strong>ich möchte das Schnittgut selber beräumen</p>
<p class="auto-style2"><strong>5. meine Hecke/ Pflanze ist.…cm (L/B/G)</strong></p>
<p>Länge in cm*
<textarea name="länge" style="width: 50px; height: 20px">
</textarea> </p>
<p>Breite in cm*
<textarea name="breite" style="width: 50px; height: 19px">
</textarea> </p>
<p>Höhe in cm*&nbsp;
<textarea name="höhe" style="width: 50px; height: 20px">
</textarea> </p>
<p class="auto-style4"><strong>&nbsp;&nbsp;&nbsp;&nbsp; *1m=100cm/
5m= 500cm/ 10m= 1000cm/ 50m= 5000cm</strong></p>
<p>
<input name="rabat" onclick="calculate-3();" type="checkbox" value="_-3%" />
<span class="auto-style3">bei Vorkasse/Barzahlung -3% Skonto!</span></p>
<h3>Ergebnis: </h3>
<p>
<input class="preisfeld" name="meter" readonly="" size="5" type="text" />
Gesamtlänge in Meter</p>
<p>
<input class="preisfeld" name="netto" readonly="" size="5" type="text" />
Euro Gesamtpreis netto </p>
<p>
<input class="preisfeld" name="mwsteuer0" readonly="" size="5" type="text" />
Euro inkl. MwSt. (19 %)</p>
<p><input class="sendbutton" type="submit" value="Berechnen" />
<p><input class="sendbutton" name="reset" type="reset" value="Löschen" />
</p>
<!-- wrapperfuss --></fieldset></form>
</div>
<input name="_10P3" type="hidden" value="1,7" />
<input name="_1P" type="hidden" value="1" />
<input name="_20P4" type="hidden" value="2" />
<input name="_5P2" type="hidden" value="1,3" />
<input +="" name="breite" type="hidden" value="1" />
<input +="" name="höhe" type="hidden" value="1" />
<input name="jährlichP6" type="hidden" value="1" />
<input +="" name="länge" type="hidden" value="1" /><type=submit /p="" value="Berechnen" /><input name="nochnieP5" type="hidden" value="2" />
<input name="ordner0" type="hidden" value="2" />
<input name="plz3" type="hidden" value="1.5" />
<input name="schnittgutjaP7" type="hidden" value="1,5" />
<input name="schnittgutneinP0" type="hidden" value="1" />
<input name="netto" type="hidden" value="1" />
<input name="meter" type="hidden" value="1" />
<input name="mwsteuer0" type="hidden" value="+19%" />
<input name="rabat" type="hidden" value="-3%" />
<html>
</html></div><html>
</html></div><html>

</html></body><html>

</html>

</html>

<html></html>

  1. Hallo cubataxi,

    so richtig verstehe ich weder deine Beschreibung noch deinen Code. Daher nur ein paar allgemeine Anmerkungen:

    Dein HTML ist fehlerhaft. Prüf das Mal mit dem Validator.

    Wenn du die Formularelemente nur als IO für dein Javascript benötigst, lass das <form ...> und </form> am Besten weg. Sonst musst du den Neuaufruf deiner Seite, der auch alle Eingaben löscht, durch ein "return false" im onsubmit unterdrücken.

    Eingaben aus input-Feldern sind Strings. Vor dem Rechnen musst du sie in Zahlen umwandeln, z.B. mit parseFloat. Vorher solltest du prüfen, ob es überhaupt Zahlen sind, z.B. mit isNaN. Da die User gerne ein Komma als Dezimaltrenner nehmen, musst du das evtl. noch durch den in Programmiersprachen üblichen Dezimal-Punkt ersetzen. Hier mal ein Zahl-Tester aus meiner Wühlkiste:

      
    function checknum(num) {  
     if (isNaN(num)) num = num.replace(/,/g,".") ; // Wenn keine Zahl: , -> .  
     if (isNaN(num)) { alert("Bitte eine Zahl eingeben!") ; return "nan" ; } // Wenn immer noch keine Zahl: Fehlermeldung  
     return parseFloat(num) ;  
    }
    

    Gruß, Jürgen

    1. Hallo cubataxi,

      so richtig verstehe ich weder deine Beschreibung noch deinen Code. Daher nur ein paar allgemeine Anmerkungen:

      Dein HTML ist fehlerhaft. Prüf das Mal mit dem Validator.

      Wenn du die Formularelemente nur als IO für dein Javascript benötigst, lass das <form ...> und </form> am Besten weg. Sonst musst du den Neuaufruf deiner Seite, der auch alle Eingaben löscht, durch ein "return false" im onsubmit unterdrücken.

      Eingaben aus input-Feldern sind Strings. Vor dem Rechnen musst du sie in Zahlen umwandeln, z.B. mit parseFloat. Vorher solltest du prüfen, ob es überhaupt Zahlen sind, z.B. mit isNaN. Da die User gerne ein Komma als Dezimaltrenner nehmen, musst du das evtl. noch durch den in Programmiersprachen üblichen Dezimal-Punkt ersetzen. Hier mal ein Zahl-Tester aus meiner Wühlkiste:

      function checknum(num) {
      if (isNaN(num)) num = num.replace(/,/g,".") ; // Wenn keine Zahl: , -> .
      if (isNaN(num)) { alert("Bitte eine Zahl eingeben!") ; return "nan" ; } // Wenn immer noch keine Zahl: Fehlermeldung
      return parseFloat(num) ;
      }

      
      >   
      > Gruß, Jürgen  
        
      Hoffe ich bekomme es irgendwann mal hin, gebe mir mühe, muss ja mal funken bei mir, hoffe ich! Danke trotz dem!!! mfg  
      }
      
  2. Hallo,

    Hallo, bin neu und hoffe es kann mir einer helfen und licht ins dunkle mir bringen. Also, habe mir gewagt, auszuprobieren einen eigenen Preisrechner zu gestalten. Bis zum Gestalten bin ich gekommen, aber wie verknüpfe ich die html das dieser auch rechnet!

    zunächst mal ist dein HTML noch grob fehlerhaft, damit meine ich insbesondere das zahlreiche, mehrmalige und falsch verschachtelte Vorkommen von html- head- und body-Elementen; das Schließen leerer Elemente in XHTML-Syntax, obwohl du kein XHTML verwendest; die Verwendung seltsamer Zeichenkombinationen für Attribute (oder was soll <input +=""> sein?). Und die Verwendung von hidden-Feldern außerhalb des Formulars erschließt sich mir auch nicht - was willst du damit erreichen?

    Eingabe aller Kreterin

    Was haben die Damen von Kreta damit zu tun?

    und ihr könnt mal über einen Anfänger lachen, hoffe aber ihr könnt mir helfen, das ich es auch verstehe.

    Bevor ich lache, würde ich gern erstmal verstehen, was _du_ mit dem bisherigen Code eigentlich im Sinn hast. Wenn ich das verstanden habe, kann ich dir möglicherweise auch helfen.

    Angefangen von der plz 15370 nach unten und nach oben, (Entfernung) 1,1-1.2-1,3 proportional( %) erhöhen. Dann % tual erhöhen (Arbeitsaufwand) * Gesamtmeter= netto bzw.+ 19% bzw. -3%  Skonto. Ich hoffe es ist verständlich was ich meine.

    Leider nein, keine Spur.
    Was nützt dir die Postleitzahl? Wenn du sie als Grundlage für die Entfernung heranziehst, brauchst du eine sehr gute Geo-Datenbank. Was ist "tual"? Vielleicht solltest du uns im ersten Schritt mal ohne HTML-Code(!) die vorgesehenen Eingaben übersichtlich aufzählen und erläutern, wie die miteinander verknüpft werden sollen. Dann sehen wir weiter.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>

    <head>
    <meta content="[...]" name="keywords" />
    <meta content="http://www.cubataxi.de/index5.html" name="andie" />

    Unfug. Es gibt kein meta-Element mit dem Namen "andie". Meintest du vielleicht name="author"?
    Und das name-Attribut notiert man üblicherweise zuerst, um sich selbst oder einem anderen Leser das Erkennen des Elements leichter zu machen.

    <script src="http://www.cubataxi.de.js" type="text/javascript"></script>

    Ich bin mir sicher, dass http://www.cubataxi.de.js keine gültige URL ist.

    </head></html><head>

    Sowas meinte ich weiter oben: head-Element beenden, html beenden (danach dürfte schon nichts mehr kommen), dann außerhalb von html ein weiteres head-Element aufmachen?

    <style type="text/css">

    .auto-style1 {
    font-size: large;
    }
    </style>
    </head>

    ... und wieder beenden.

    <html>
    <body id="top" style="height: 1132px">

    Dann ein neues html-Element, und dort beginnt der body. Eine völlig chaotische, fehlerhafte Struktur. Ein HTML-Dokument besteht aus genau _einem_ html-Element, darin genau _ein_ head- und _ein_ body-Element.
    Außerdem ist es eine ganz schlechte Idee, body auf eine feste Höhe zu nageln.

    <script src="http://www.cubataxi.de.js" type="text/javascript"></script>

    Das hattest du doch weiter oben schon. Wozu nochmal?

      		<p>&nbsp;<!-- #BeginEditable "PLZ" --><textarea name="plz3" style="width: 50px; height: 21px">15370  
    

    </textarea><!-- #EndEditable --> </p>

    Das ist auch Unsinn - zum einen ein potentiell mehrzeiliges Eingabefeld (textarea) für die Eingabe einer simplen Postleitzahl zu nehmen, zum anderen eine feste Größe dafür zu setzen.

      		<p><select name="ordner0" size="1">  
      		<option selected="" value="1">Laubhecke/pflanze</option>  
      		<option value="1,3">Nadelheck/pflanze</option>  
      		<option value="2">Freiwachsende Hecke</option>  
      		<option value="2">Blütenpflanze-Strauch</option>  
      		</select> &nbsp;</p>  
    

    Was möchtest du später mit den values machen? Mir kommt es seltsam vor, dass sie manchmal einen Zahlenwert enthalten, manchmal zwei mit einem Komma getrennte.

      		<p>  
      		<input name="\_1P" onclick="calculateeins();" type="checkbox" value="1" />  
      		vor 1-5 jahren</p>  
      		<p>  
      		<input name="\_5P2" onclick="calculatefünf();" type="checkbox" value="1,3" />  
      		vor 5-10 jahren</p>  
      		<p>  
      		<input name="\_10P3" onclick="calculatezehn();" style="height: 20px" type="checkbox" value="1,7" />vor  
      		10-20 jahren</p>  
      		<p>  
      		<input name="\_20P4" onclick="calculatezwanzig();" style="height: 20px" type="checkbox" value="2" />  
      		vor über 20 jahren &lt; &nbsp;/p&gt; </p>  
    

    Diese Auswahlmöglichkeiten schließen sich gegenseitig aus, das Mittel der Wahl wären also Radiobuttons, nicht Checkboxen, weil Checkboxen ja auch eine Mehrfachauswahl erlauben. Zu den values ... siehe oben.

      		<p>Länge in cm\*  
      		<textarea name="länge" style="width: 50px; height: 20px">  
    

    </textarea> </p>
    <p>Breite in cm*
    <textarea name="breite" style="width: 50px; height: 19px">
    </textarea> </p>
    <p>Höhe in cm*&nbsp;
    <textarea name="höhe" style="width: 50px; height: 20px">
    </textarea> </p>

    Wie schon bei der Postleitzahl: Wieso textarea-Elemente anstatt eines simplen <input type="text">?

      		<input name="rabat" onclick="calculate-3();" type="checkbox" value="\_-3%" />  
    

    "Rabatt" schreibt sich mit zwei 't'. Was du da hast, ist die Stadt in Marokko. ;-)

    <input +="" name="breite" type="hidden" value="1" />
    <input +="" name="höhe" type="hidden" value="1" />

    Was ist das?

    <html>
    </html></div><html>
    </html></div><html>

    </html></body><html>

    </html>

    </html>

    <html></html>

    Und das?

    Es mag hart klingen, aber hier würde ich wirklich empfehlen: Einreißen und sauber neu anfangen.

    So long,
     Martin

    --
    Ich denke, also bin ich hier falsch.
    Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    1. @@Der Martin:

      nuqneH

      <meta content="http://www.cubataxi.de/index5.html" name="andie" />

      Unfug. Es gibt kein meta-Element mit dem Namen "andie".

      Wenn man Metadaten „andie“ haben möchte, warum nicht? ;-) Man sollte nur nicht davon ausgehen, dass andere solche Metadaten verarbeiten können.

      Wenn der Wert von @content ein URI ist, ist das ein sicheres Zeichen dafür, dass meta das falsche Element ist und man stattdessen link mit @rel und @href verwenden möchte:

      <link href="http://www.cubataxi.de/index5.html" rel="andie" />

      Meintest du vielleicht name="author"?

      Oder @rel="author".

      Und das name-Attribut notiert man üblicherweise zuerst, um sich selbst oder einem anderen Leser das Erkennen des Elements leichter zu machen.

      Auch kein schlechter Tip. Also <link rel="author" href="http://www.cubataxi.de/index5.html" />

      Qapla'

      --
      „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)