✔ Mehrfache Berechnungen in einer Funktion

Sprint

Sprint

Erfahrenes Mitglied
Hallo zusammen,

ich bin dabei, ein kleines Kalkulationsprogramm zu schreiben. Im Prinzip lächerlich einfach, nur soll jeder Tastendruck augenblicklich eingerechnet werden. Die Ausgangslage ist die. Jeder User einer Seite bekommt verschiedene Artikel freigegeben. Bei einem sind es vielleicht nur drei, bei einem anderen 20. Jeder Artikel besteht aus vier Teilen, deren Preis mit verschiedenen Faktoren multipliziert werden. Daraus ergibt sich dann der empf. Verkaufspreis. Aus einer Datenbank werden die Preise ausgelesen und in einem Formular dargestellt. Je Artikel vier Eingabefelder und dahinter das Summenfeld. Die eigentliche Rechenfunktion habe ich bereits und mit einem Artikel funktioniert es auch. Mein Problem ist nun, diese Funktion auf eine jeweils unterschiedliche Anzahl von Gruppen anzuwenden. D.h., egal in welches Feld der Admin die Zahlen einträgt, es soll immer sofort die entsprechende Summe aktualisiert werden. Natürlich könnte ich für jeden Artikel eine eigene Funktion erzeugen lassen, aber das kann ja wohl nicht der Sinn sein.
So sieht das ganze aus:
HTML: 
<script language="JavaScript">

preis = new array();

preis[0] = new array();
preis[0][1] = 1250;
preis[0][2] = 200;
preis[0][3] = 420;
preis[0][4] = 120;
   ...
preis[n] = new array();
preis[n][1] = 1700;
preis[n][2] = 190;
preis[n][3] = 6700;
preis[n][4] = 225;

function calculate() {
	fakt1 = parseFloat( document.formular.fakt1.value.replace(/,/ , ".") );
	fakt2 = parseFloat( document.formular.fakt2.value.replace(/,/ , ".") );
	fakt3 = parseFloat( document.formular.fakt3.value.replace(/,/ , ".") );
	fakt4 = parseFloat( document.formular.fakt4.value.replace(/,/ , ".") );
	document.formular.summe.value = ((fakt1 * preis1) + (fakt2 * preis2) + (fakt3 * preis3) + (fakt4 * preis4)).toString().replace(/\./ , ",");
}
-->
</script>
</head>

<body>

<form name="formular">

	<input type="text" name="fakt[0][1]" onkeyup="calculate()">
	<input type="text" name="fakt[0][2]" onkeyup="calculate()">
	<input type="text" name="fakt[0][3]" onkeyup="calculate()">
	<input type="text" name="fakt[0][4]" onkeyup="calculate()">
	<input type="text" name="summe[0]" onkeyup="calculate()"><p>
	
	...
	
	<input type="text" name="fakt[n][1]" onkeyup="calculate()">
	<input type="text" name="fakt[n][2]" onkeyup="calculate()">
	<input type="text" name="fakt[n][3]" onkeyup="calculate()">
	<input type="text" name="fakt[n][4]" onkeyup="calculate()">
	<input type="text" name="summe[n]" onkeyup="calculate()"><p>

</form>

Kann mir jemand helfen, die Funktion zu verallgemeinern? Vielen Dank schon mal im Voraus.
 
Hi,

du kannst der Funktion calculate ein Argument übergeben. Dieses repräsentiert den Index des gewünschten Preises.

Angesprochen wird die erforderliche Komponente über das elements-Objekt.

Im Übrigen wird das Schlüsselword Array in JS gross geschrieben.

Code: 
<html>
<head>
<title>Titel</title>
<script language="JavaScript">
preis = new Array();

preis[0] = new Array();
preis[0][1] = 1250;
preis[0][2] = 200;
preis[0][3] = 420;
preis[0][4] = 120;
//   ...
preis[1] = new Array();
preis[1][1] = 1700;
preis[1][2] = 190;
preis[1][3] = 6700;
preis[1][4] = 225;

function calculate(intIndex) {
  //alert(intIndex);
	fakt1 = parseFloat( document.formular.elements['fakt['+intIndex+'][1]'].value.replace(/,/ , ".") );
	fakt2 = parseFloat( document.formular.elements['fakt['+intIndex+'][2]'].value.replace(/,/ , ".") );
	fakt3 = parseFloat( document.formular.elements['fakt['+intIndex+'][3]'].value.replace(/,/ , ".") );
	fakt4 = parseFloat( document.formular.elements['fakt['+intIndex+'][4]'].value.replace(/,/ , ".") );
	document.formular.elements['summe['+intIndex+']'].value = ((fakt1 * preis[intIndex][1]) + (fakt2 * preis[intIndex][2]) + (fakt3 * preis[intIndex][3]) + (fakt4 * preis[intIndex][4])).toString().replace(/\./ , ",");
}
-->
</script>

</head>

<body>
<form name="formular">

	<input type="text" name="fakt[0][1]" onkeyup="calculate(0)">
	<input type="text" name="fakt[0][2]" onkeyup="calculate(0)">
	<input type="text" name="fakt[0][3]" onkeyup="calculate(0)">
	<input type="text" name="fakt[0][4]" onkeyup="calculate(0)">
	<input type="text" name="summe[0]" onkeyup="calculate(0)"><p>
	
	...
	
	<input type="text" name="fakt[1][1]" onkeyup="calculate(1)">
	<input type="text" name="fakt[1][2]" onkeyup="calculate(1)">
	<input type="text" name="fakt[1][3]" onkeyup="calculate(1)">
	<input type="text" name="fakt[1][4]" onkeyup="calculate(1)">
	<input type="text" name="summe[1]" onkeyup="calculate(1)"><p>

</form>
</body>
</html>

Ciao
Quaese
 
Hm, eigentlich ganz einfach, nur mit der Index-Übergabe von HTML an JS komm ich nicht klar. So richtig werde ich das wohl nie kapieren.
Klappt super, vielen Dank und ein schönes WE.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück