Foros del Web » Programando para Internet » Javascript »

Sumar columna de tabla

Estas en el tema de Sumar columna de tabla en el foro de Javascript en Foros del Web. Hola, estoy tratando de sumar los valores de una columna pero el resultado es NaN El codigo: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código Javascript : Ver original <table ...
  #1 (permalink)  
Antiguo 19/05/2010, 07:49
Avatar de manumaf  
Fecha de Ingreso: mayo-2007
Ubicación: Argentina
Mensajes: 853
Antigüedad: 16 años, 1 mes
Puntos: 6
Sumar columna de tabla

Hola, estoy tratando de sumar los valores de una columna pero el resultado es NaN

El codigo:
Código Javascript:
Ver original
  1. <table id="tabla" width="600" border="1" cellspacing="0" cellpadding="7">
  2.  <tr>
  3.     <td>El Dueño</td>
  4.     <td><input name="textfield" type="text" size="3" /></td>
  5.    <td>67</td>
  6.    <td><a href="borrar.php?id=4"> Eliminar</a></td>
  7.  </tr>
  8.  <tr>
  9.     <td>El Dueño</td>
  10.     <td><input name="textfield" type="text" size="3" /></td>
  11.    <td>22</td>
  12.    <td><a href="borrar.php?id=4"> Eliminar</a></td>
  13.  </tr>
  14. </table>
  15.  
  16. <script type="text/javascript">
  17. var total = 0;
  18. for(var i = 0; tabla.rows[i]; i++) {
  19. total += Number(tabla.rows[i].cells[3].innerHTML);
  20. }
  21. document.write(total)
  22. </script>

Lo que quiero es que se suma 67 + 22

Que estoy haciendo mal?
  #2 (permalink)  
Antiguo 19/05/2010, 08:04
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 14 años, 1 mes
Puntos: 1485
Respuesta: Sumar columna de tabla

te muestra NaN porque estas sumando la columna incorrecta. el nodelist cells es como un array, de modo que los elementos son indexados comenzando desde el 0. en tu caso, estas haciendo referencia a la cuarta columna y no la tercera.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #3 (permalink)  
Antiguo 19/05/2010, 08:34
Avatar de manumaf  
Fecha de Ingreso: mayo-2007
Ubicación: Argentina
Mensajes: 853
Antigüedad: 16 años, 1 mes
Puntos: 6
Respuesta: Sumar columna de tabla

Claro muchisimas gracias, y como puedo hacer que multiplique por la cantidad? que es un campo de texto

<input name="textfield" type="text" size="3" />
  #4 (permalink)  
Antiguo 19/05/2010, 08:41
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 14 años, 1 mes
Puntos: 1485
Respuesta: Sumar columna de tabla

asignale un ID al campo y obtienes la referencia mediante document.getElementById. luego lees la propiedad value el cual te devolvera el texto contenido en el INPUT y finalmente lo multiplicas con la cantidad.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #5 (permalink)  
Antiguo 19/05/2010, 08:44
Avatar de manumaf  
Fecha de Ingreso: mayo-2007
Ubicación: Argentina
Mensajes: 853
Antigüedad: 16 años, 1 mes
Puntos: 6
Respuesta: Sumar columna de tabla

Código Javascript:
Ver original
  1. <input name="textfield" type="text" size="3" id="0" onchange="sumar()" />
  2.  
  3. function sumar() {
  4.     var total = 0;
  5.    
  6.     for(var i = 0; tabla.rows[i]; i++) {
  7.      document.getElementById('1').value
  8.         total += Number(tabla.rows[i].cells[2].innerHTML) * document.getElementById(i).value ;
  9.     }
  10.     return total
  11. }
  12. document.write (sumar());

El "id=0" va incrementandose al crearse la tabla.

No me funciona, no me imprime nada en pantalla
  #6 (permalink)  
Antiguo 19/05/2010, 08:56
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.050
Antigüedad: 14 años, 1 mes
Puntos: 1485
Respuesta: Sumar columna de tabla

por norma, no deberias usar numeros como valor para los IDs. aplica las mismas normas para nombrar variables. en todo caso, te falla en la linea 7. al no existir un elemento con dicho id, getElementById devuelve null pero seguido intentas leer la propiedad value de null el cual no existe y genera error. hay varias posibilidades para realizarlo, pero para tus efectos, asigna una palabra seguido del numero. por ejemplo "textfield0". luego, para obtener el elemento compone el string "textfield" con la variable i.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.

Etiquetas: columna, tablas
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:14.