Totalen uit een for loop optellen

[Muiter]

Hoe kan ik het totaal van velden optellen die in een for loop staan? Ik heb weinig ervaring met javascript en geen enkel idee. De waarde die ik wil optellen worden reeds opgebouwd door js.

De waarde komen uit:

<input type="text" name="bew_totaal[]" size="10" style="text-align:right;background-color: #f1f1f1" value="<?php if($bew_totaal[$i] != ''){ echo $bew_totaal[$i]; } ?>" readonly="readonly" />

 

[jorants]

hoi,

ik weet niet zeker of ik wel goed begrijp wat je bedoelt, het lijkt er op of je met PHP bezig bent.... ik zie namelijk geen javascript in je stukje code.

groetjes,

joran

 

[ErikBooy007]

Probeer eens iets in deze richting:

[JS]
<script type="text/javascript">

var els = document.getElementsByTagName('input');
var totaal = 0;
for ( var i = 0; i < els.length; i++ ) {
if ( els.name == 'bew_totaal[]' ) {
totaal += parsefloat ( els.value );
}
}

</script>
[/JS]

[EDIT]
Het zou kunnen zijn dat je op regel 6 de twee blokhaken weg moet halen...
[/EDIT]

 

[Muiter]

Bedankt voor je reactie ErikBooy007, echter krijg ik wat ik ook probeer ik krijg de melding: deze eigenschap of methode wordt niet ondersteund.

 

[ErikBooy007]

Probeer op regel 7 eens parsefloat te vervangen door parseFloat en als dat niet werkt moet je maar even aangeven op welke regel de foutmelding slaat...

 

[That Guy]

Hier, E's code, maar dan anders:
[JS]/* tel alle velden met 'name' 'bew_totaal[]' bij elkaar op */

var i, totaal = 0;
var elems = document.getElementsByName('bew_totaal[]');
var l = elems.length;

for(i=0; i<l; i++)
{
totaal += parseFloat(elems.value);
}
[/JS]overgens komt het denk ik omdat IE geen getElementsByTagName ondersteund? (noot: vraagteken).



:thumb:

 

[ErikBooy007]

Hmm, volgens mij wel.

Ik vroeg me alleen af of het getElementsByName of getElementsByClassName was dat niet ondersteund werd... Volgens mij is het getElementsByClassName.

 

[That Guy]

getElementsByName in ieder geval wel (mn voorbeeld was getest in FF en IE8 ). ClassName in IE geloof ik niet.


:thumb:

 

[Muiter]

Bedankt voor de reacties. Door mijn (wel verdiende) vakantie heb ik niet eerder verder kunnen kijken.
De foutmelding wordt gegeven in bij de js maar bij het oproepen daarvan:
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal(this.form)" size="75" value="" />

 

[That Guy]

ja, er is geen totaal-fucntie?


-->[JS]function totaal(elem)
{
/* tel alle velden met 'name' 'bew_totaal[]' bij elkaar op */

var i, totaal = 0;
var elems = document.getElementsByName('bew_totaal[]');
var l = elems.length;

for(i=0; i<l; i++)
{
totaal += parseFloat(elems.value);
}
//doe iets met variabele totaal...
}[/JS]

 

[Muiter]

Zoals aangeven is JS vrij nieuw voor mij.

Waar komt dan (elem) vandaan?

 

[That Guy]

Okay, een stapje terug:

een functie is in javascript (zoals alles in js) een object. een functie geef je zo aan:[js]function naamVanFunctie(optioneleParameterLijst)[/js]. Een aanroep bevat dus de naam, haakje openen, parameters, en haakje sluiten.

Bijvoorbeeld:[JS]function doeIets(data)
{
alert(data); /* doe iets met parameter data */
}[/JS]aanroep:[JS]doeIets('test'); /* alert 'test' */

doeIets('een voorbeeld'); /* alert 'een voorbeeld' */[/JS]




nu, jij zegt

<... onKeyup="totaal(this.form)" ...>

ofwel, bij het omhoog gaan van een key van dat element, moet de functie totaal() worden uitgevoerd, met als parameter this.form (referentie naar het huidige element, attribuut 'form').

Nu zie ik niet precies wat je nou wilt bereiken hiermee, want de parameter is lichtelijk overbodig denk ik. Kan je nog eens aangeven wat precies het doel is van je script? En vooral wanneer wat moet worden geactiveerd?




:thumb:

 

[Muiter]

Nu zie ik niet precies wat je nou wilt bereiken hiermee, want de parameter is lichtelijk overbodig denk ik. Kan je nog eens aangeven wat precies het doel is van je script? En vooral wanneer wat moet worden geactiveerd?

Ik heb een tekstveld in een loop (dus die kan 1x of 80x worden ingevuld): input type="text" name="bew_totaal[]"

Ik wil het totaal van al deze velden optellen. Dat is mijn doel.

 

[That Guy]

Ja, maar wanneer wil je dat doen? Als iemand iets typt in 1 van de velden? In een knop (button)?

 

[Muiter]

Ik wil het totaal opnieuw berekenen op het moment dat één van de velden bew_totaal[] wijzigt.

 

[That Guy]

Mokay, dan wordt het zoiets:

<script type='text/javascript'>

function totaal()
{
   /* tel alle velden met 'name' 'bew_totaal[]' bij elkaar op */
 
   var i, totaal = 0;
   var elems = document.getElementsByName('bew_totaal[]');
   var l = elems.length;
 
   for(i=0; i<l; i++)
   {
      totaal += parseFloat(elems[i].value);
   }

   alert(totaal);
}
</script>


<!-- hier iets, of niet... -->




<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" /> 
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" />  
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" />

<!-- eventueel meer input's -->

op het moment krijg je een alert met alle waardes, maar je kan het natuurlijk ook ergens instoppen (een inputveld, een div, een span, roep het)


:thumb:

 

[Muiter]

Bedankt voor het voorbeeld Vegras echter ik blijf de melding Deze eigenschap of methode wordt ondersteund houden

 

[That Guy]

Oh, er stond ook een naamfout in. Dit is mn testfile, en werkt hier (FF3.6 en IE8)

<html><body>
<script type='text/javascript'>
 
function totaal()
{
   /* tel alle velden met 'name' 'bew_totaal[]' bij elkaar op */
 
   var i, totaal = 0;
   var elems = document.getElementsByName('bew_opmerkingen[]');
   var l = elems.length;
 
   for(i=0; i<l; i++)
   {
      totaal += parseFloat(elems[i].value) || 0;
   }
 
   alert(totaal);
}
</script>

 
<!-- hier iets, of niet... -->
 
 
 
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" /> 
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" />  
<input type="text" name="bew_opmerkingen[]" onKeyup="totaal()" size="75" value="" />
 
<!-- eventueel meer input's -->

</body></html>

:thumb:

 

[Muiter]

Hey, het werkt :thumb::thumb::thumb:

Nu wil ik de waarde gelijk in een veld invullen, ik probeer dat met:

document.getElementsByName('totaal_abs') = totaal;

helaas, zonder succes.

 

[That Guy]

Dat komt omdat die functie een array returnt. Je kan beter het element ById aanroepen:

<div id='iets'></div>

[JS]var res = document.getElementById('iets');

res.innerHTML = totaal;[/JS]:thumb: