Berechnung meherer Egebnisse aus Checkboxen und Textfeldern
Torsten
- javascript
Hallo,
Ich hoffe mir kann jemand von Euch helfen ohne die Hände über dem Kopf zusammen zuschlagen.
Ich bin leider in JS noch ein Neuling, des wegen die Frage, die vieleicht albern klingt.
Ich brauch ein Formular in dem man Höhe(oder Tiefe), Breite, Länge eingibt.
Darum befinden sich 3 "Container" mit Checkboxen.
Im ersten Container sollen die Values der Checkboxen, wenn eine oder mehr checked sind, zusammengerechnet werden und mit ((Länge * Breit) + (Länge * Höhe)) multipliziert werden.
Im zweiten Container sollen die dortigen Checkboxen , wenn checked, mit (Länge * Breit) multipliziert werden.
Und Im dritten Checkboxcontainer ist nur eine checkbox, diese soll wenn checked mit ((Länge * Breite)*0.3) multipliziert werden.
Mein Problem besteht nun darin, ich habe 4 einzelne .js Scripte die auch den gewünchten Erfolg bringe, das erste berechnet Live die länge* breite etc, bei Eingabe.
Die anderen 3 Scripte erkenne ob eine Checkbox im jeweiligen Container checked ist und rechnen sie gegebenenfalls zusammen.
wie kann ich mir jetzt aber die Ergebnisse aller "gecheckten" Checkboxen mit den jeweiligen (länge *breite) etc berechnen lassen und die als Gesamtergebnis anzeigen lassen, vorzugsweise mit 2 Nachkommastellen.
Hier mal mein Code:
1.HTML
<script type="text/javascript" src="autocalc.js"></script>
<script type="text/javascript" src="updateCost.js"></script>
<script type="text/javascript" src="antislip.js"></script>
<script type="text/javascript" src="updateCostO.js"></script>
<form name="autoSumForm">
<input class="right" type=text name="lang" value="" maxlength="3" onFocus="startCalc();" onBlur="stopCalc();" >
<input class="right" type=text name="breit" value="" maxlength="3" onFocus="startCalc();" onBlur="stopCalc();" >
<input class="right" type=text name="tief" value="" maxlength="3" onFocus="startCalc();" onBlur="stopCalc();" >
</form>
<input type="checkbox" id='service0' value="9.99" onclick="UpdateCost();" >
<input type="checkbox" id='service1' value="9.99" onclick="UpdateCost();">
<input type="checkbox" id='service2' value="9.99" onclick="UpdateCost();">
<input type="checkbox" id='service3' value="9.99" onclick="UpdateCost();">
<input type="checkbox" id='service4' value="9.99" onclick="UpdateCost();">
<input type="checkbox" id='oservice0' value="9.99" onclick="UpdateCostO();">
<input type="checkbox" id='oservice1' value="9.99" onclick="UpdateCostO();">
<input type="checkbox" id='antislip0' value="9.99" onclick="AntiSlip();">
<input type="checkbox" id='oservice2' value="9.99" onclick="UpdateCostO();">
<input type="checkbox" id='oservice3' value="9.99" onclick="UpdateCostO();">
<input type="text" id='complete1' readonly="readonly" value="" />Unterwasser<p>
<input type="text" id='complete2' readonly="readonly" value="" ;/>Oberwasser<p>
<input type="text" id='complete3' readonly="readonly" value="" ;/>Antislip<p>
<input type="button" id="rechnen" value="Berechne" onclick="UpdateCostFull();"/>
<input type="text" id="ergebnis" readonly="readonly" value=""><p>
<input type="text" id="flaechegesamt" readonly="readonly" value="">Gesamt<p>
<input type="text" id="flaecheoberwasser" readonly="readonly" value="">OWS<p>
<input type="text" id="flaecheunterwasser" readonly="readonly" value="">UWS<p>
<input type="text" id="flaecheantislip" readonly="readonly" value="">Antislip<p>
Die einzelnen Berechnungen sollen später nicht sichtbar sein, nur das Gesamtergebnis, vorzugsweise Live oder auch per Button druck.
antislip(), UpdateCost() und UpdateCostO() sollen , wie beschrieben, mit jeweils anderen Formeln weitergenutzt werden, die aber alle aus Länge, und/oder Breite und/oder Höhe/Tiefe bestehen.
Ps: die Values sind fiktiv und werden noch geändert.
autocalc.js für die Fläche
function startCalc(){
interval = setInterval("calc()",1);
}
function calc(){
var one = 0;
var two = 0;
var three = 0;
var ows = 0;
var uws = 0;
var atsl = 0;
one = document.autoSumForm.lang.value;
two = document.autoSumForm.breit.value;
three = document.autoSumForm.tief.value;
ows = ((one * 1) * (two * 1));
uws = (((one * 1) * (two * 1)) + ((one * 1) * (((three * 1 ) + 0.5))));
atsl = (0.30 * ((one * 1) * (two * 1)));
gesamt = ((ows) + (uws));
function Dezimalstellen(num) {
if(isNaN(num))
num = "0";
Vorzeichen = (num == (num = Math.abs(num)));
num = Math.floor(num*100+0.50000000001);
cents = num%100;
num = Math.floor(num/100).toString();
if(cents<10)
cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+','+
num.substring(num.length-(4*i+3));
return (((Vorzeichen)?'':'-') + num + ',' + cents);
}
ows1 = Dezimalstellen(ows);
uws1 = Dezimalstellen(uws);
atsl1 = Dezimalstellen(atsl);
gesamt1 = Dezimalstellen(gesamt);
document.getElementById('flaechegesamt').value = (gesamt1);
document.getElementById('flaecheoberwasser').value = (ows1);
document.getElementById('flaecheunterwasser').value = (uws1);
document.getElementById('flaecheantislip').value = (atsl1);
}
function stopCalc(){
clearInterval(interval);
}
Nun noch ein Beispiel für den Checkboxcode, die sehen im Grunde alle gleich aus, nur das sie auf die anzahl der CHeckboxen pro "Container" angepasst sind.
function UpdateCost() {
var complete1 = 0
var sum = 0;
var gi, elem;
for (i=0; i<5; i++) {
gi = 'service'+i;
elem = document.getElementById(gi);
if (elem.checked == true) { sum += Number(elem.value); }
}
document.getElementById('complete1').value = sum.toFixed(2);
}
Alles Scripte werfen ihre Ausgaben wenn sie nicht gleich Null sind alle zurück ins HTML, wie kann ich nun als Beispiel das Value 'complete1' mit 'flaecheunterwasser' multipliziere, das mit den anderen ebenso und das Gesamtergebnis anzeigen lassen???
Soviel wie möglich des Javascriptcodes sollte in extra .js Dateien.
Vielen Dank für Eure Hilfe im Voraus
Torsten
Hallo Torsten,
Ich hoffe mir kann jemand von Euch helfen ohne die Hände über dem Kopf zusammen zuschlagen.
das schreibst sich für Dich einfacher, als es für uns ist. ;(
Ich brauch ein Formular in dem man Höhe(oder Tiefe), Breite, Länge eingibt.
Darum befinden sich 3 "Container" mit Checkboxen.
Das Formular hast Du ja soweit auch, aber was habe ich mir unter "Darum befinden sich" zu verstehen? Es befinden sich 10 Checkboxen insgesamt unterhalb der drei Eingabefelder für Höhe, Breite und Tiefe.
Was meinst Du mit Container?
Gruß aus Berlin!
eddi