SUMAR onclick

[Zipus]

Quiero que al hacer clic en unos div's, se sume su contenido en un input.
Los divs són los sigientes:

<div id="25585489" onclick="sumar()">50</div>
<div id="97856235" onclick="sumar()">70</div>
<div id="25649823" onclick="sumar()">90</div>
<div id="89812845" onclick="sumar()">30</div>

NOTA: Los id son aleatorios

Entonces cuando se haga clic en un div, se ha de poner en un:
<input type="text" id="resultado_div" name="suma"/>

Como puedo poner el resultado, es decir que funcion deberia utilizar, es que no se casi nada de javascript y necesito hacer esto.

Mil gracias!!

[Patriarka]

Iniciado por Zipus

Quiero que al hacer clic en unos div's, se sume su contenido en un input.
Los divs són los sigientes:

<div id="25585489" onclick="sumar()">50</div>
<div id="97856235" onclick="sumar()">70</div>
<div id="25649823" onclick="sumar()">90</div>
<div id="89812845" onclick="sumar()">30</div>

NOTA: Los id son aleatorios

Entonces cuando se haga clic en un div, se ha de poner en un:
<input type="text" id="resultado_div" name="suma"/>

Como puedo poner el resultado, es decir que funcion deberia utilizar, es que no se casi nada de javascript y necesito hacer esto.

Mil gracias!!

agregale NAME="divs[]" a los divs

<div id="89812845" NAME="divs[]" onclick="sumar()">30</div>

<script type="text/javascript">
var list = document.getElementsByName("divs");
var suma=0;
for(var i = 0; i < list.length; i++)
{
suma += parseInt((list[i].id));
//alert(list[i].id);
}
alert(suma);
</script>

[Zipus]

Muchas gracias por TODO!!

como se escribiria esto dentro del input..

[Patriarka]

te los sumo?
es asi:
..........
alert(suma);
document.getElementById('resultado_div').value=sum a;

[Zipus]

Gracias por todo, pero no me funciona.. sera que me he equivocado.

Código Javascript:

<script type="text/javascript">
function sumar() {
    var list = document.getElementsByName("divs");
var suma=0;
for(var i = 0; i < list.length; i++)
{
suma += parseInt((list[i].id));
//alert(list[i].id);
}
document.getElementById('resultado_div').value=suma;
}
 
</script>
 

<input type="text" id="resultado_div" name="suma"/>

y los divs una vez en pantalla, son asi:

<div id="25585489" name="divs[]" onclick="sumar()">50</div>
<div id="97856235" name="divs[]" onclick="sumar()">70</div>
<div id="25649823" name="divs[]" onclick="sumar()">90</div>
<div id="89812845" name="divs[]" onclick="sumar()">30</div>

Pero todo el rato me sale 0 :(

[Patriarka]

hace esto:

Código Javascript:

<script type="text/javascript">
    function sumar() {
        var list = document.getElementsByName("divs");
    var suma=0;
    alert(list.length);
    for(var i = 0; i < list.length; i++)
    {
    suma += parseInt((list[i].id));
    
    }
    alert(suma);
    document.getElementById('resultado_div').value=suma;
    }
     
    </script>
 

mostrame que te devuelve suma y list.length

[Zipus]

Los dos me devuelven 0, estas seguro que eso suma el contenido de los div? xD

[Patriarka]

faltan los []

var list = document.getElementsByName("divs[]");

[Zipus]

ahora si que sale algo en el input, pero me sale la suma de todos los id

yo quiero que si hago click en uno me sume ese, no todos como ahora...
a parte el resultado no es del contenido de los divs, eso suma el contenido de los id

[Zipus]

es decir, esto:


<div id="25585489" name="divs[]" onclick="sumar()">50</div>
<div id="97856235" name="divs[]" onclick="sumar()">70</div>
<div id="25649823" name="divs[]" onclick="sumar()">90</div>
<div id="89812845" name="divs[]" onclick="sumar()">30</div>

es: 50+70+90+30=240

[Patriarka]

con js podes acceder a todos sus elementos como su contenido
hace esto para que te sume todos los valores
suma += parseInt((list[i].innerHTML));

ya tenes todo para pensar como acceder a cada valor

mostrame como genera el id automatico

[Zipus]

los id se muestran de la base de datos, que anteriormente se han introducido de con la funcion time() de php

[Patriarka]

y bueno mostrame como armas esto
<div id="25585489" name="divs[]" onclick="sumar()">50</div>
<div id="97856235" name="divs[]" onclick="sumar()">70</div>
<div id="25649823" name="divs[]" onclick="sumar()">90</div>
<div id="89812845" name="divs[]" onclick="sumar()">30</div>

[Zipus]

Código PHP:

if ( $r !== false && mysql_num_rows($r) > 0 ) {
      while ( $a = mysql_fetch_assoc($r) ) {
$created =    ($a['created']); 
$finno =        ($a['finn']);
$finn = number_format($finno, 2, ",", ".");
 

y luego

Código PHP:

echo '<td class="excel4" ALIGN="center"><div id="'.$created.'" name="divs[]" onclick="sumar()">'.$finn.'</div></td>';
 

[Patriarka]

echo '<td class="excel4" ALIGN="center"><div id="'.$created.'" name="divs[]" onclick="sumar('.$finn.')">'.$finn.'</div></td>';

a sumar le agregue el valor a calcular, ya te di los metodos para obtener los valores y asignarlos
agregale a la funcion el parametro: function suma(valor){ alert(parseInt(valor)); }

[Aijoona]

No es más sencillo utilizar event delegates?

[Zipus]

Ya he hecho lo de php y esto:

Código Javascript:

<script type="text/javascript">
function sumar(valor) {
var list = document.getElementsByName("divs[]");
var suma=0;
for(var i = 0; i < list.length; i++)
{
suma += parseInt((list[i].innerHTML));
//alert(list[i].id);
}
document.getElementById('resultado_div').value=suma;
}
 
</script>
 

Pero no se que tengo que hacer con { alert(parseInt(valor)); }

Gracias por la ayuda de verdad!

Y la info que encuentro sobre event delegation, esta en ingles :(
ademas creo que ya esta casi...

[Aijoona]

Basicamente es observar la interaccion desde un nivel superior, con lo cual te ahorras de crear/eliminar los handlers para todos los elementos (presentes o futuros)

[IsaBelM]

ve a la sección de addEventListener. aqui tienes otro ejemplo

[Zipus]

Código Javascript:

<script type="text/javascript">
function sumar(valor) {
var list = document.getElementsById('resultado_div');
var suma = parseInt(list) + parseInt(valor);
document.getElementById('resultado_div').value=suma;
}
 
</script>
 

Código PHP:

echo '<td class="excel4" ALIGN="center"><div id="'.$created.'" onclick="sumar('.$finno.')">'.$finn.'</div></td>';
 

Código HTML:

<input type="text" id="resultado_div" name="suma" size="7" value="0"/>
 

Que esty haciendo mal?
Perdon por la insistencia xD

Gracias!

[IsaBelM]

sólo en esta línea tienes dos errores

var list = document.getElementsById('resultado_div');

una vez que los corrijas ya puedes ponerte con la buena aportación de Aijoona. y si no lo entiendes prueba con lo que te dejo yo

[Zipus]

vale, pero como lo resuelvo?

[IsaBelM]

Iniciado por Zipus

vale, pero como lo resuelvo?

como un simple consejo. con esa actitud haces que lo que quieren ayudarte, desistan

[Zipus]

creo que lo estoy haciendo bien:

Código Javascript:

<script type="text/javascript">
function sumar(valor) {
var list = document.getElementsByName('suma').value;
var suma = parseInt(list) + parseInt(valor);
document.getElementById('resultado_div').value=suma;
}
</script>
 

Código HTML:

<input type="text" id="resultado_div" name="suma" size="7" value="0"/>
 

Código PHP:

echo '<td class="excel4" ALIGN="center"><div id="'.$created.'" onclick="sumar('.$finno.')">'.$finn.'</div></td>';
 

Lo que passa es que al hacer clic, el input me devuelve NaN

Me podeis ayudar :( !!

[Zipus]

Así es como sale mas tarde en el navegador (cliente), es decir si el usuario mira el codigo fuente:

Código HTML:

<td class="excel4" ALIGN="center"><div id="1315161129" name="divs[]" onclick="sumar(81985)">81.985,00</div></td>
 

[Zipus]

Ya lo he solucionado:

Código Javascript:

<script type="text/javascript">
function sumar(valor) {
var list = document.res.suma.value;
// var list = document.getElementsByName('suma');
var suma = parseInt(list) + parseInt(valor);
document.getElementById('resultado_div').value=suma;
}
</script>
 

Gracias a todos por vuestra ayuda!!

[Gastoncillo]

Zipus, podrias compartir el codigo? gracias!!