uträkningar i formulär

2 svar · 427 visningar · startad av room 30 juli 2007

roomMedlem sedan mars 2001270 inlägg

Frågan30 juli 2007 19:54#1

Hej på er glada javascriptsgurus :)

Håller på med en site för att skapa orderlistor och har stött på patrull. Är inte superbevandrad i Javascript så jag hoppas att det finns folk därute som kan hjälpa mig.

Här kommer lite kod så förklarar jag nedan:

<div id="totalpris">Antal artiklar: x st - Netto: x kr</div>

<input name="_netto_129" type="hidden" value="198" />
<input name="order_129" type="text" class="textField" id="129" />

<input name="_netto_130" type="hidden" value="198" />
<input name="order_130" type="text" class="textField" id="130" />

<input name="_netto_131" type="hidden" value="198" />
<input name="order_131" type="text" class="textField" id="131" />

I exemplet ovan har jag rensat bort all onödig tabelldata.

I den hidden input som heter _netto_xxx finns nettopriset för en vara. Och i inputfältet som heter order_xxx ska man skriva i antal man vill köpa.

Skulle nu vilja ha en funktion som räknar ut dels hur många produkter man har valt att köpa totalt, dels hur mycket totalpriset är. Som ni förstår så är det många fler artiklar än de jag gav exempel på ovan.

Detta skall sedan bilda en sträng som ersätter innerhtml på den div som heter totalpris.

Någon som har några bra ideer om hur man gör en sådan funktion tages emot med tacksamhet.

Ha det!

roomMedlem sedan mars 2001270 inlägg

31 juli 2007 19:42#2

Är det ingen som har nån idé om detta ??

Tacksam för svar

nitro2k01Medlem sedan aug. 20039 340 inlägg

1 aug. 2007 07:13#3

<script>

function calcTotals(){
	var tels=document.getElementById('order').elements;
	var numarticles=netprice=0;
	var error='';

	for (var i=0; i<tels.length; i++){
		if (/^order_\d+$/.test(tels[i].name))
			if (tels[i].value && !isNaN(parseInt(tels[i].value)) ){
				numarticles+=parseInt(tels[i].value);

				tels[i].style.backgroundColor='';

				netprice+=
					parseInt(tels['_netto_'+tels[i].id].value) *
					parseInt(tels[i].value);
			}else if(tels[i].value.length){
				tels[i].style.backgroundColor='#faa';
				error='Det finns fel i formuläret. Vänligen skriv nummer i rödmarkerade rutor.';
			}
	}

	document.getElementById('totalpris').innerHTML=
		numarticles?
			'Antal artiklar: ' + numarticles + ' st - Netto: ' + netprice + ' kr. '+error
		:
			'Inga artiklar valda. '+error;
}

</script>

<body onload="calcTotals();" onkeyup="calcTotals();" onchange="calcTotals();" onclick="calcTotals();">

<form id="order">

<div id="totalpris">Inga artiklar valda.</div>

<input name="_netto_129" type="hidden" value="198" />
<input name="order_129" type="text" class="textField" id="129" />

<input name="_netto_130" type="hidden" value="198" />
<input name="order_130" type="text" class="textField" id="130" />

<input name="_netto_131" type="hidden" value="198" />
<input name="order_131" type="text" class="textField" id="131" />
<br />
<input type="button" onclick="calcTotals();">

</form>

Jag utvecklade detta lite. där har du vad du bad om och lite till.