Ayuda, Formularios con suma a tiempo real ¿?

BooMeranGz · #1 (**permalink**) 25/06/2004, 18:29

Hola,

Estoy haciendo unos formularios en los cuales necesito igresar valores (numeros) en otros 5 campos y a la vez que se vaya mostrando el total de la suma de los mismos en un 6to. campo o en en una tabla, en la misma página (tipo las tablas de Excel).

¿como puedo hacer esto?

Gracias y salu2.

JavierB · #2 (**permalink**) 26/06/2004, 04:46

Hola, BooMeranGz.

Código HTML:

<html>
<head>
<script>
function sumar() {
	elem=document.forms[0].elements;
	t=0;
	for(i=0;i<elem.length;i++)
		t+=parseInt(elem[i].value);
	document.getElementById('tot').innerHTML=t;		
}
</script>
</head>

<body>
<form>
<input type="text" value="0" onkeyup="sumar()" />
<input type="text" value="0" onkeyup="sumar()" />
Total: <span id="tot"></span>
</form>
</body>
</html>

Espero que te sirva. Saludos,

BooMeranGz · #3 (**permalink**) 26/06/2004, 14:23

Perfecto JavierB :)

¡Eso es lo que necesito realmente!

Muchas gracias.

BooMeranGz · #4 (**permalink**) 26/06/2004, 15:04

Oye JavierB, tu ejemplo me funciona muy bien en un form normal, pero no se como implementarlo en el que tengo que usar yo.
Ya que en este caso son 3 columnas que deben sumar por separado dentro de un form mas completo y además luego con un "ENVIAR" debo poder pasar todas las variables a la siguiente página... (que luego las tomo con PHP y las guardo en una MySQL)

Este es en resumen el form que tengo:

Código HTML:

<html>
<head>
</head>
<body> 
<form name="form" method="post" action="preview.fax.dedicated.php"> 
 <table width="600" border="0" align="center" cellpadding="0" cellspacing="2"> 
  <tr> 
   <td align="center">Description of Service</td> 
   <td align="center">Quantity</td> 
   <td align="center">Unit Price </td> 
   <td align="center">Ext. Price </td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_cs1" type="text" id="de_cs1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q11" type="text" id="de_q11" size="6" maxlength="6"></td> 
   <td><input name="de_u11" type="text" id="de_u11" size="6" maxlength="6"></td> 
   <td><input name="de_e11" type="text" id="de_e11" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_b1" type="text" id="de_b1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q12" type="text" id="de_q12" size="6" maxlength="6"></td> 
   <td><input name="de_u12" type="text" id="de_u12" size="6" maxlength="6"></td> 
   <td><input name="de_e12" type="text" id="de_e12" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o1" type="text" id="de_o1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q13" type="text" id="de_q13" size="6" maxlength="6"></td> 
   <td><input name="de_u13" type="text" id="de_u13" size="6" maxlength="6"></td> 
   <td><input name="de_e13" type="text" id="de_e13" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o11" type="text" id="de_o11" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q14" type="text" id="de_q14" size="6" maxlength="6"></td> 
   <td><input name="de_u14" type="text" id="de_u14" size="6" maxlength="6"></td> 
   <td><input name="de_e14" type="text" id="de_e14" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o12" type="text" id="de_o12" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q15" type="text" id="de_q15" size="6" maxlength="6"></td> 
   <td><input name="de_u15" type="text" id="de_u15" size="6" maxlength="6"></td> 
   <td><input name="de_e15" type="text" id="de_e15" size="6" maxlength="6"></td> 
  </tr> 
  <tr> 
   <td align="right">Total Setup fee* </td> 
   <td align="center">total columna 1</td> 
   <td align="center">total columna 2</td> 
   <td align="center">total columna 3</td> 
  </tr> 
 </table> 
</form> 
</body>
</html>

Como podrás ver lo que necesito es que sumen las 3 columnas por separado (con lo que podría hacer las mismas tres funciones que me muestras con diferente nombre), pero el problema principal lo tengo cuando quiero que se mantengan los valores de los campos al enviar los datos por medio del "action=".

Además, ¿es posible que el numero no solo sea un entero y pueda poner "punto" o "coma" para los decimales?

Si me puedes dar una mano te lo agradeceré enormemente :)

Salu2.

BooMeranGz · #5 (**permalink**) 05/07/2004, 11:39

Hola, disculpen, se que no es la política del foro el postear un mensaje para que vuelva al índice, pero realmente necesito ayuda con este tema...

Muchas gracias de antemano.

Salu2.

JavierB · #6 (**permalink**) 05/07/2004, 12:04

Hola, BooMeranGz.

Me había olvidado de este mensaje. A ver si esto te sirve, aunque para que funcione bien es mejor que a los inputs les pongas un valor inicial de cero (value=0)

Código HTML:

<html>
<head>
<script>
function sumar(obj,num) {
	cel=obj.id.substr(0,5);
	total=0;
	for(i=1;i<6;i++)
		total+=parseInt(document.getElementById(cel+i).value);
	document.getElementById(num).innerHTML=total;
}
</script>
</head>
<body> 
<form name="form" method="post" action="preview.fax.dedicated.php"> 
 <table width="600" border="0" align="center" cellpadding="0" cellspacing="2"> 
  <tr> 
   <td align="center">Description of Service</td> 
   <td align="center">Quantity</td> 
   <td align="center">Unit Price </td> 
   <td align="center">Ext. Price </td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_cs1" type="text" id="de_cs1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q11" type="text" id="de_q11" size="6" maxlength="6" onkeyup="sumar(this,1)"></td> 
   <td><input name="de_u11" type="text" id="de_u11" size="6" maxlength="6" onkeyup="sumar(this,2)"></td> 
   <td><input name="de_e11" type="text" id="de_e11" size="6" maxlength="6" onkeyup="sumar(this,3)"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_b1" type="text" id="de_b1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q12" type="text" id="de_q12" size="6" maxlength="6" onkeyup="sumar(this,1)"></td> 
   <td><input name="de_u12" type="text" id="de_u12" size="6" maxlength="6" onkeyup="sumar(this,2)"></td> 
   <td><input name="de_e12" type="text" id="de_e12" size="6" maxlength="6" onkeyup="sumar(this,3)"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o1" type="text" id="de_o1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q13" type="text" id="de_q13" size="6" maxlength="6" onkeyup="sumar(this,1)"></td> 
   <td><input name="de_u13" type="text" id="de_u13" size="6" maxlength="6" onkeyup="sumar(this,2)"></td> 
   <td><input name="de_e13" type="text" id="de_e13" size="6" maxlength="6" onkeyup="sumar(this,3)"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o11" type="text" id="de_o11" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q14" type="text" id="de_q14" size="6" maxlength="6" onkeyup="sumar(this,1)"></td> 
   <td><input name="de_u14" type="text" id="de_u14" size="6" maxlength="6" onkeyup="sumar(this,2)"></td> 
   <td><input name="de_e14" type="text" id="de_e14" size="6" maxlength="6" onkeyup="sumar(this,3)"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o12" type="text" id="de_o12" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q15" type="text" id="de_q15" size="6" maxlength="6" onkeyup="sumar(this,1)"></td> 
   <td><input name="de_u15" type="text" id="de_u15" size="6" maxlength="6" onkeyup="sumar(this,2)"></td> 
   <td><input name="de_e15" type="text" id="de_e15" size="6" maxlength="6" onkeyup="sumar(this,3)"></td> 
  </tr> 
  <tr> 
   <td align="right">Total Setup fee* </td> 
   <td align="center" id="1">total columna 1</td> 
   <td align="center" id="2">total columna 2</td> 
   <td align="center" id="3">total columna 3</td> 
  </tr> 
 </table> 
</form> 
</body>
</html>

Saludos,

BooMeranGz · #7 (**permalink**) 05/07/2004, 12:49

JavierB, muchas gracias, ¡¡¡este si es el que me sirve!!!

Solo una pregunta mas, ¿como hago para que los numeros no sean enteros y puedan tener al menos 2 decimales?

Te pregunto esto ya que lo que necesito es colocar en esos campos valores "monetarios"

Gracias y salu2 nuevamente.

BooMeranGz · #8 (**permalink**) 05/07/2004, 23:28

Estimado amigo JavierB,

He resuelto el tema de los decimales, pero como veo que eres un genio en esto, te quiero pedir algo más para poder terminar este form

En un principio, solo necesitaba sumar cada una de las 3 columnas, que es lo que tu me has resuelto.

O sea que tengo esto:

Código:

Description of Service | Quantity | Unit Price | Ext. Price |
xxxxxxxxxxxxxxxxxxxxxx | valor11  | valor 21   | valor 31   |
xxxxxxxxxxxxxxxxxxxxxx | valor12  | valor 22   | valor 32   |
xxxxxxxxxxxxxxxxxxxxxx | valor13  | valor 23   | valor 33   |
Total Setup fee  =     | suma 1x  | suma 2x    | suma 3x    |

Bueno, ahora necesito que cada fila multiplique Unit Price * Quantity y lo coloque en Ext. Price.
Luego, que se haga la suma de cada columna tal como se hace ahora.

O sea:

Código:

Description of Service | Quantity | Unit Price | Ext. Price |
xxxxxxxxxxxxxxxxxxxxxx | valor11  * valor 21   =  valor 31  |
xxxxxxxxxxxxxxxxxxxxxx | valor12  * valor 22   =  valor 32  |
xxxxxxxxxxxxxxxxxxxxxx | valor13  * valor 23   =  valor 33  |
Total Setup fee  =     | suma 1x  | suma 2x    |  suma 3x   |

Este es el código que estamos usando, si me puedes hacer esa funcion me sacas un gran peso de encima

Código HTML:

<html><head>
<script>
function sumar(obj,num) {
	cel=obj.id.substr(0,5);
	total=0;
	for(i=1;i<4;i++)
      total+=parseFloat(document.getElementById(cel+i).value);
	document.getElementById(num).innerHTML=total;
}
</script>
</head>
<body> 
<form name="form" method="post" action="preview.fax.dedicated.php"> 
 <table width="600" border="0" align="center" cellpadding="0" cellspacing="2"> 
  <tr> 
   <td align="center">Description of Service</td> 
   <td align="center">Quantity</td> 
   <td align="center">Unit Price </td> 
   <td align="center">Ext. Price </td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_cs1" type="text" id="de_cs1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q11" type="text" id="de_q11" onkeyup="sumar(this,1)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u11" type="text" id="de_u11" onkeyup="sumar(this,2)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e11" type="text" id="de_e11" onkeyup="sumar(this,3)" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_b1" type="text" id="de_b1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q12" type="text" id="de_q12" onkeyup="sumar(this,1)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u12" type="text" id="de_u12" onkeyup="sumar(this,2)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e12" type="text" id="de_e12" onkeyup="sumar(this,3)" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o1" type="text" id="de_o1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q13" type="text" id="de_q13" onkeyup="sumar(this,1)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u13" type="text" id="de_u13" onkeyup="sumar(this,2)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e13" type="text" id="de_e13" onkeyup="sumar(this,3)" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td colspan="4"><strong>(Ext. Price =  Unit Price * Quantity) </strong></td>
  </tr> 
  <tr> 
   <td align="right">Total Setup fee* </td> 
   <td align="center" id="1">0</td> 
   <td align="center" id="2">0</td> 
   <td align="center" id="3">0</td> 
  </tr> 
 </table> 
</form> 
</body></html>

Desde ya muchas gracias y espero no seguir molestando con esto

Salu2.

JavierB · #9 (**permalink**) 06/07/2004, 12:16

Hola otra vez.

No estoy seguro de haberte entendido bien, ni estoy seguro de no haberme liado mucho con el código

Pero, en fín Pilarín... Ahí va eso y tú veras si va bien la cosa:

Código HTML:

<html><head>
<script>
function sumar(num) {
	elem=document.getElementById('ta').getElementsByTagName('tr')[num];
	cel1=parseFloat(elem.getElementsByTagName('td')[1].childNodes[0].value);	
	cel2=parseFloat(elem.getElementsByTagName('td')[2].childNodes[0].value);
	elem.getElementsByTagName('td')[3].childNodes[0].value=cel1 * cel2;
	// Ahora vamos a sumar las columnas
	var tot = new Array;
	tot[1]=0; tot[2]=0; tot[3]=0;
	for(i=1;i<4;i++) {
		elem=document.getElementById('ta').getElementsByTagName('tr')[i];
		for(j=1;j<4;j++)
			tot[j]+=parseFloat(elem.getElementsByTagName('td')[j].childNodes[0].value);
	}
	for(i=1;i<4;i++)
		document.getElementById(i).innerHTML=tot[i];	
}
</script>
</head>
<body> 
<form name="form" method="post" action="preview.fax.dedicated.php"> 
 <table id="ta" width="600" border="0" align="center" cellpadding="0" cellspacing="2"> 
  <tr> 
   <td align="center">Description of Service</td> 
   <td align="center">Quantity</td> 
   <td align="center">Unit Price </td> 
   <td align="center">Ext. Price </td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_cs1" type="text" id="de_cs1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q11" type="text" id="de_q11" onkeyup="sumar(1)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u11" type="text" id="de_u11" onkeyup="sumar(1)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e11" type="text" id="de_e11" readonly="readonly" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_b1" type="text" id="de_b1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q12" type="text" id="de_q12" onkeyup="sumar(2)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u12" type="text" id="de_u12" onkeyup="sumar(2)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e12" type="text" id="de_e12" readonly="readonly" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td><input name="de_o1" type="text" id="de_o1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q13" type="text" id="de_q13" onkeyup="sumar(3)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u13" type="text" id="de_u13" onkeyup="sumar(3)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e13" type="text" id="de_e13" readonly="readonly" value="0" size="6" maxlength="6"></td> 
  </tr> 
  <tr align="center"> 
   <td colspan="4"><strong>(Ext. Price =  Unit Price * Quantity) </strong></td>
  </tr> 
  <tr> 
   <td align="right">Total Setup fee* </td> 
   <td align="center" id="1">0</td> 
   <td align="center" id="2">0</td> 
   <td align="center" id="3">0</td> 
  </tr> 
 </table> 
</form> 
</body></html>

Saludos,

BooMeranGz · #10 (**permalink**) 06/07/2004, 13:45

PERFECTO JavierB,

Muchas gracias, me comprendiste perfectamente

¿Me podrías explicar brevemente como modificar la función por si necesito agregar mas filas y columnas (iguales a las que ya tengo)?

Salu2.

::::: EDITADO :::::

Si no me equivoco el valor a cambiar para agregar mas filas/columnas es:

Código:

for(i=1;i<4;i++) {

o sea que si agrego una fila con las mismas columnas ¿deberia poner 5 en vez de 4?
Y a la vez en la siguiente <tr><td>... me ¿debería quedar asi?

Código HTML:

<tr align="center"> 
   <td><input name="de_o1" type="text" id="de_o1" value="" size="60" maxlength="80"></td> 
   <td><input name="de_q14" type="text" id="de_q14" onkeyup="sumar(4)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_u14" type="text" id="de_u14" onkeyup="sumar(4)" value="0" size="6" maxlength="6"></td> 
   <td><input name="de_e14" type="text" id="de_e14" readonly="readonly" value="0" size="6" maxlength="6"></td> 
  </tr>

O sea: onkeyup="sumar(4)"
Por lo que la función sería la misma con un solo cambio:

Código HTML:

<script>
function sumar(num) {
	elem=document.getElementById('ta').getElementsByTagName('tr')[num];
	cel1=parseFloat(elem.getElementsByTagName('td')[1].childNodes[0].value);	
	cel2=parseFloat(elem.getElementsByTagName('td')[2].childNodes[0].value);
	elem.getElementsByTagName('td')[3].childNodes[0].value=cel1 * cel2;
	// Ahora vamos a sumar las columnas
	var tot = new Array;
	tot[1]=0; tot[2]=0; tot[3]=0;
                // aqui modifico el <x por la cantidad de filas que tengo a sumar.
		for(i=1;i<5;i++) { 
		elem=document.getElementById('ta').getElementsByTagName('tr')[i];
		for(j=1;j<4;j++)
			tot[j]+=parseFloat(elem.getElementsByTagName('td')[j].childNodes[0].value);
	}
	for(i=1;i<4;i++)
		document.getElementById(i).innerHTML=tot[i];	
}
</script>

Bueno, al menos lo pruebo asi y funciona, si es correcto por favor avísame asi lo trabajo de esta manera

Salu2.

BooMeranGz · #11 (**permalink**) 06/07/2004, 23:49

JavierB ¿hay otra manera de hacer esta función, que no sea usando como referencia los tgas <tb>/<tr>/<td>?

Te pregunto, ya que en esta página todo funciona bien, pero al meterle algo de PHP entre medio y generar una nueva <tr><td> para un título (que depende de que tipo de presupuesto sea), la función deja de "funcionar"...

Este es parte del código real que estoy usando y que está dento de un "form" mas complejo:

Código HTML:

<table width="620"  border="0" align="center" cellpadding="0" cellspacing="4"> 
     <tr> 
      <td align="center" valign="middle">
			<table id="ta" width="600" border="0" cellpadding="0" cellspacing="2"> 
        <tr align="left"> 
         <td colspan="4">Service Set-Up Charges: </td> 
        </tr>
        <tr> 
         <td align="center">Description of Service</td> 
         <td align="center">Quantity</td> 
         <td align="center">Unit Price </td> 
         <td align="center">Ext. Price </td> 
        </tr>
				<? 
				if ($var_pres=='co'){
				 echo '<tr align="center">
				 <td align="left">Cabinet Space:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				} else {
				 echo '<tr align="center">
				 <td align="left">Optionals:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				}
				?>
        <tr align="center"> 
         <td><input name="pr_cs1" type="text" id="pr_cs1" value="" size="60" maxlength="80"></td> 
         <td><input name="pr_q11" type="text" id="pr_q11" onkeyup="sumar(1)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_u11" type="text" id="pr_u11" onkeyup="sumar(1)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_e11" type="text" id="pr_e11" readonly="readonly" value="0" size="6" maxlength="6"></td> 
        </tr>
				<?
				if ($var_pres=='co'){
				 echo '<tr align="center">
				 <td align="left">Bandwith:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				} else {
				 echo '<tr align="center">
				 <td align="left">Optionals 1:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				}
				?> 
        <tr align="center"> 
         <td><input name="pr_b1" type="text" id="pr_b1" value="" size="60" maxlength="80"></td> 
         <td><input name="pr_q12" type="text" id="pr_q12" onkeyup="sumar(2)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_u12" type="text" id="pr_u12" onkeyup="sumar(2)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_e12" type="text" id="pr_e12" readonly="readonly" value="0" size="6" maxlength="6"></td> 
        </tr>
				<?
				if ($var_pres=='co'){
				 echo '<tr align="center">
				 <td align="left">Optionals:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				} else {
				 echo '<tr align="center">
				 <td align="left">Optionals 2:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				}
				?> 
        <tr align="center"> 
         <td><input name="pr_o1" type="text" id="pr_o1" value="" size="60" maxlength="80"></td> 
         <td><input name="pr_q13" type="text" id="pr_q13" onkeyup="sumar(3)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_u13" type="text" id="pr_u13" onkeyup="sumar(3)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_e13" type="text" id="pr_e13" readonly="readonly" value="0" size="6" maxlength="6"></td> 
        </tr>
				<?
				if ($var_pres=='co'){
				 echo '<tr align="center">
				 <td align="left">Optionals 1:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				} else {
				 echo '<tr align="center">
				 <td align="left">Optionals 3:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				}
				?> 
        <tr align="center"> 
         <td><input name="pr_o11" type="text" id="pr_o11" value="" size="60" maxlength="80"></td> 
         <td><input name="pr_q14" type="text" id="pr_q14" onkeyup="sumar(4)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_u14" type="text" id="pr_u14" onkeyup="sumar(4)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_e14" type="text" id="pr_e14" readonly="readonly" value="0" size="6" maxlength="6"></td> 
        </tr>
				<?
				if ($var_pres=='co'){
				 echo '<tr align="center">
				 <td align="left">Optionals 2:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				} else {
				 echo '<tr align="center">
				 <td align="left">Optionals 4:</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 <td>&nbsp;</td>
				 </tr>';
				}
				?> 
        <tr align="center"> 
         <td><input name="pr_o12" type="text" id="pr_o12" value="" size="60" maxlength="80"></td> 
         <td><input name="pr_q15" type="text" id="pr_q15" onkeyup="sumar(5)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_u15" type="text" id="pr_u15" onkeyup="sumar(5)" value="0" size="6" maxlength="6"></td> 
         <td><input name="pr_e15" type="text" id="pr_e15" readonly="readonly" value="0" size="6" maxlength="6"></td> 
        </tr> 
        <tr align="center"> 
         <td>&nbsp;</td> 
         <td>&nbsp;</td> 
         <td>&nbsp;</td> 
         <td>&nbsp;</td> 
        </tr> 
        <tr> 
         <td align="right">Total Setup fee* </td> 
				 <td align="center" id="1"><strong>0</strong></td>
				 <td align="center" id="2"><strong>0</strong></td>
				 <td align="center" id="3"><strong>0</strong></td>  
        </tr> 
       </table></td> 
     </tr> 
    </table>

Si tu le ves solución, por favor dime como seria, sinó, igual dime para buscarle la vuelta de otra manera

Salu2. y nuevamente gracias.

PD: Si necesitas ver toda la página solo dime que la posteo aqui, no lo hice ahora por la extensión.

BooMeranGz · #12 (**permalink**) 11/07/2004, 14:45

Hola JavierB,

Ya le encontré la solución al tema de las <tr><td> que se generan entre medio con PHP de las que tengo que calcular, sin modificar tu función javascript.

Lo que me falta saber ahora son 2 cosas:

a) Principalemente tu haces esto para ir viendo los resultados de la suma de cada una de las 3 columnas a tiempo real:

Código HTML:

<tr>
 <td align="right">Total Setup fee*</td>
 <td align="center" id="1">0</td>
 <td align="center" id="2">0</td>
 <td align="center" id="3">0</td>
</tr>

En este punto, necesito guardar en 3 variables diferentes los totales finales de cada columna, ¿como puedo hacer eso?

b) Y la otra pregunta es ¿como puedo usar la misma función para hacer los cálculos de la misma manera en una nueva tabla (igual a la anterior) dentro de la misma página?

Yo lo que hice fué duplicar la función, cambiarle el nombre y los valores de las array para tratar de identificar nuevos totales mediante id="4", id="5" e id="6", en una nueva tabla con id="ta1", pero funcionan los cálculos de las filas y no me muestra los totales.
¿Es posible resolver esto?
Esta es la función duplicada:

Código HTML:

<SCRIPT Language = "JavaScript">
<!--
function sumar1(num1) {
 elem = document.getElementById('ta1').getElementsByTagName('tr')[num1];
 cel1 = parseFloat(elem.getElementsByTagName('td')[1].childNodes[0].value);	
 cel2 = parseFloat(elem.getElementsByTagName('td')[2].childNodes[0].value);
 elem.getElementsByTagName('td')[3].childNodes[0].value = cel1 * cel2;
 // Ahora vamos a sumar las columnas
 var tot = new Array;
  tot[4] = 0;
  tot[5] = 0;
  tot[6] = 0;
  // aqui modifico el <x por la cantidad de filas que tengo a sumar.
  for(i = 1; i < 6; i++) {
   elem = document.getElementById('ta1').getElementsByTagName('tr')[i];
   for(j = 1; j < 4; j++)
    tot[j] += parseFloat(elem.getElementsByTagName('td')[j].childNodes[0].value);
  }
  for(i = 4; i < 7; i++)
   document.getElementById(i).innerHTML = tot[i];	
}
-->
</SCRIPT>

Desde ya muchas gracias por tu valiosa ayuda...
Salu2.

BooMeranGz · #13 (**permalink**) 11/07/2004, 22:45

Hola,

La pregunta b), la he solucionado con la funcíón de esta manera:

Código HTML:

<SCRIPT Language = "JavaScript">
<!--
function sumar1(num1) {
 elem = document.getElementById('ta1').getElementsByTagName('tr')[num1];
 cel1 = parseFloat(elem.getElementsByTagName('td')[1].childNodes[0].value);	
 cel2 = parseFloat(elem.getElementsByTagName('td')[2].childNodes[0].value);
 elem.getElementsByTagName('td')[3].childNodes[0].value = cel1 * cel2;
 // Ahora vamos a sumar las columnas
 var tot1 = new Array;
  tot1[1] = 0;
  tot1[2] = 0;
  tot1[3] = 0;
  // aqui modifico el <x por la cantidad de filas que tengo a sumar.
  for(i = 1; i < 6; i++) {
   elem = document.getElementById('ta1').getElementsByTagName('tr')[i];
   for(j = 1; j < 4; j++)
    tot1[j] += parseFloat(elem.getElementsByTagName('td')[j].childNodes[0].value);
  }
  for(i = 1; i < 4; i++)
   document.getElementById(i+3).innerHTML = tot1[i];	
}
-->
</SCRIPT>

Pero no encuentro solución a la pregunta a), o sea de como guardar los totales finales en variables para pasarlas a otras en PHP

Salu2.

JavierB · #14 (**permalink**) 12/07/2004, 01:07

Hola, BooMeranGz.

La forma más fácil de guardar el resultado a una variable sería:

variable1=document.getElementById('1').innerHTML;

Lo de pasarlo a PHP te lo dejo a tí, porque yo ando muy cortito en este lenguaje.

Espero que te sirva. Saludos,

BooMeranGz · #15 (**permalink**) 12/07/2004, 11:28

Gracias JavierB,

¿En que parte de la función debo asignar los totales a esas variables?, ¿o es en las tablas dónde hago los cálculos?

Salu2.

BooMeranGz · #16 (**permalink**) 17/07/2004, 14:03

Disculpa, olvidé postear para avisarte que ya lo he resuleto.

El tema de 2 ó más funciones en la misma página ya está, y el paso de las vars. a php lo hice con campos hidden en el mimo form, haciendo los cálculos en la siguiente página ya que no pude tomarla desde la función, pero gracias x todo, al menos he terminado esa página y quedó muy bien

Salu2.