Foros del Web » Programando para Internet » Javascript »

Efectuar operaciones entre campos de un formulario

Estas en el tema de Efectuar operaciones entre campos de un formulario en el foro de Javascript en Foros del Web. Hola amigos, buen dia y buen karma para ustedes. Primero que nada, aclaro que soy bastante novato en JS. Le se mas al PHP a ...
  #1 (permalink)  
Antiguo 06/07/2012, 02:43
 
Fecha de Ingreso: septiembre-2009
Mensajes: 56
Antigüedad: 14 años, 7 meses
Puntos: 0
Efectuar operaciones entre campos de un formulario

Hola amigos, buen dia y buen karma para ustedes.

Primero que nada, aclaro que soy bastante novato en JS. Le se mas al PHP a pesar que lo aprendi 100% autodidacta. El JS lo estoy aprendiendo del mismo modo y lentamente.

Por lo mismo mi duda podria parecer muy basica.

Tengo un formulario con varios campos entre los cuales debo hacer operaciones.

El formulario esta dividio en 14 "partidas" aqui pongo las primeras 6, el resto son muy repetitivas


Código PHP:
<form name="Form1" method="post" action="siguientepagina.html"  id="Form1">

<?php /* PARTIDA 1 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox6" name="c1" value="" tabindex="110" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox8"  name="p1" value="" tabindex="140" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox9" name="i1" value="" readonly="readonly">



<?php /* PARTIDA 2 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox10" name="c2" value="" tabindex="210" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox13" name="p2" value="" tabindex="240" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox14" name="i2" value="" readonly="readonly">


<?php /* PARTIDA 3 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox15" name="c3" value="" tabindex="310" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox17" name="p3" value="" tabindex="340" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox18" name="i3" value="" readonly="readonly">

<?php /* PARTIDA 4 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox19" name="c4" value="" tabindex="410" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox21" name="p4" value="" tabindex="440" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox22" name="i4" value="" readonly="readonly">

<?php /* PARTIDA 5 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox23" name="c5" value="" tabindex="510" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox25" name="p5" value="" tabindex="540" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox26" name="i5" value="" readonly="readonly">


<?php /* PARTIDA 6 ----------------------------------------------------------*/ ?>
<input type="number" id="Editbox27" name="c6" value="" tabindex="610" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox29" name="p6" value="" tabindex="640" onFocus="Mate1();" onBlur="NoMate1();">
<input type="text" id="Editbox30"  name="i6" value="" readonly="readonly">

</form>
La idea es que, por ejempo en la partida 1, el campo i1 se calcule a partir de los campos c1 y p1 de la siguiente forma:

i1 = c1 * p1

y asi sucesivamente para todas las partidas, para ellos estoy llamadno a las funciones de JS Mate1() y NoMate1() las cuales pongo a continuacion

Código HTML:
<script type="text/javascript">  
// CALCULOS con los campos de texto en javascript
//Calculos Partida 1
function Mate1(){   
      interval = setInterval("calcular1()",1);   
}   
function calcular1(){   
    // partida 1
	cant1 = document.Form1.c1.value;   
    prec1 = document.Form1.p1.value; 
	if (cant1 == ""  || prec1 == "" || cant1 == null  || prec1 == null)
    {valor1 = null;}
    else
	{valor1 = (cant1 * 1) * (prec1 * 1);}
	document.Form1.i1.value = valor1;
	
	//partida 2
	cant2 = document.Form1.c2.value;    
    prec2 = document.Form1.p2.value; 
	if (cant2 == ""  || prec2 == "" || cant2 == null  || prec2 == null)
    {valor2 = null;}
    else
	{valor2 = (cant2 * 1) * (prec2 * 1);}
	document.Form1.i2.value = valor2;
	
	
	  //partida 3
	cant3 = document.Form1.c3.value;   
    prec3 = document.Form1.p3.value; 
	if (cant3 == ""  || prec3 == "" || cant3 == null  || prec3 == null)
    {valor3 = null;}
    else
	{valor3 = (cant3 * 1) * (prec3 * 1);}
	document.Form1.i3.value = valor3;
	
	//partida 4
	cant4 = document.Form1.c4.value;   
    prec4 = document.Form1.p4.value; 
	if (cant4 == ""  || prec4 == "" || cant4 == null  || prec4 == null)
    {valor4 = null;}
    else
	{valor4 = (cant4 * 1) * (prec4 * 1);}
	document.Form1.i4.value = valor4;
	
	//partida 5
	cant5 = document.Form1.c5.value;   
    prec5 = document.Form1.p5.value; 
	if (cant5 == ""  || prec5 == "" || cant5 == null  || prec5 == null)
    {valor5 = null;}
    else
	{valor5 = (cant5 * 1) * (prec5 * 1);}
	document.Form1.i5.value = valor5;
	
	//partida 6
	cant6 = document.Form1.c6.value;   
    prec6 = document.Form1.p6.value; 
	if (cant6 == ""  || prec6 == "" || cant6 == null  || prec6 == null)
    {valor6 = null;}
    else
	{valor6 = (cant6 * 1) * (prec6 * 1);}
	document.Form1.i6.value = valor6;
// ...ASI SUCESIVAMENTE PARA LAS 14 PARTIDAS

	}   
function NoMate1(){   
      clearInterval(interval);   
} 
Aqui va mi pregunta (por fin).

el codigo me funciona PERFECTAMENTE, en las partidas 1, 3,4,5,6,7 y 8, pero por alguna razon que no comprendo (estoy muuuy ciclado) NO ME FUNCIONA para las partidas 2 y de las partidas 9 a la 14.

Ya reescribi el codigo en estas paritdas, primero en copy/paste y luego a mano todo.... y me sigue pasando lo mismo.

¿Alguno de ustedes sabrá cuál es el problema?

GRACIAS DE ANTEMANO. y BUEN KARMA para ustedes.
  #2 (permalink)  
Antiguo 06/07/2012, 06:57
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Efectuar operaciones entre campos de un formulario

recomendaciones:

1 - consulte un manual de js, aquí consigue uno de los mejores: http://librosweb.es

2 - use siempre var para declarar explícitamente las variables

3 - use las colecciones para acceder a los miembros de un formulario:

document.forms['name_form'].elements['name_input'].value

4 - use parseInt() o parseFloat() para convertir valores numéricos y realizar operaciones aritméticas
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 06/07/2012, 10:57
 
Fecha de Ingreso: septiembre-2009
Mensajes: 56
Antigüedad: 14 años, 7 meses
Puntos: 0
Respuesta: Efectuar operaciones entre campos de un formulario

Antes que nada, muchas gracias maycolalvarez por tu respuestas.

La verdad para mi como novato en JS me fue muy vaioso... ya lei una parte del libro Introducción a JavaScript y he aprendido en algunas horas cosas muy valiosas.

Regreando a lo de mi problema, ves tu (o alguien mas) algun error en mi codigo???

por lo pronto voy a hacer lo siguiente:

usar var para declarar las variables. Por supuesto entiendo que esto es lo que debe ser y es una buena practica, pero no estoy seguro que me solucione mi problema puesto que el codigo funciona en otras partes en las que no uso var.

usar parseFloat() para convertir las variables (yo lo hacia a la manera "ranchera" multiplicando por 1 para forzar a que la variable, fuera numerica, je je je... leccion aprendida). Lo voy a hacer por utilizar la buena practica pero, igual que lo anterior, no estoy seguro que esto me solucione mi problema pues en algunos lugares el codigo funciona sin usar esta práctica.

Lo de usar las colecciones para acceder a los miembros del formulario, me parece que eso si lo estoy haciendo (a menos que tenga el concepto equivocado).

De todas maneras, si alguien... maycolalvarez o algún alma bendita... me pudiera decir QUE RAYOS PASA con mi codigo que en partes funciona y en partes no.... lo voy a agradecer

GRACIAS de antemano.
  #4 (permalink)  
Antiguo 06/07/2012, 12:48
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 15 años, 9 meses
Puntos: 1532
Respuesta: Efectuar operaciones entre campos de un formulario

no estás usando las colecciones, estás usando las referencias directas, que pocos navegadores soportan:

no es lo mismo:

document.formulario1.campo1.value

que:

document.forms['formulario1'].elements['campo1'].value

aunque obtengas el mismo resultado
, la primera forma te puede fallar en algunos navegadores

de los errores se aprende, corrigiendo el código puede que detecte el problema, si no, postee el código corregido y debidamente ordenado (identado) así es más agradable y comprensible para que algún miembro del foro no lo descarte y lo lea detenidamente.
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...

Etiquetas: campos, formulario, funcion, html, input, js, operaciones, php
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 15:19.