sumar o restar dependiendo de checkbox

icarocu · #1 (**permalink**) 10/04/2010, 20:46

hola amigos..

espero me puedan ayudar en lo siguiente :

tengo un form en donde quiero hacer lo siguiente:

tengo 2 campos de texto en donde se ingresan valores...
ahora, tengo 2 checkbox.. uno dice "suma", el otro "resta"..

lo que quiero hacer, es tener ahora 2 campos de texto mas...("resultado suma" y "resultado resta")
En uno, que se entregue el resultado de la suma de los valores si se ha seleccionado el checkbox "suma"...
y si se selecciona el checkbox "resta", desaparezca el resultado del campo "resultado suma".. y aparezca en "resultado resta"

se puede hacer esto !?!?

este es mi form :

<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="textfield" />
valor 1 <br />
<input type="text" name="textfield2" />
valor 2 <br />
<input name="radiobutton" type="radio" value="radiobutton" />
suma
<br />
<input name="radiobutton" type="radio" value="radiobutton" />
resta
<br />
<br />
resultado suma
<input type="text" name="textfield3" />
<br />
resultado resta
<input type="text" name="textfield4" />
<br />
</label>
</form>

mhax · #2 (**permalink**) 10/04/2010, 21:04

colocale un evento onclick a los radiobutton:

Código HTML:

Ver original<input name="radiobutton" type="radio" value="radiobutton" onclick="Suma()"/>
<input name="radiobutton" type="radio" value="radiobutton" onclick="Resta()"/>

icarocu · #3 (**permalink**) 10/04/2010, 21:21

Cita:

Iniciado por mhax

colocale un evento onclick a los radiobutton:

Código HTML:

Ver original<input name="radiobutton" type="radio" value="radiobutton" onclick="Suma()"/>
<input name="radiobutton" type="radio" value="radiobutton" onclick="Resta()"/>

gracias... lo hice asi... y me funciona..

pero como puedo limpiar el contenido de un campo de texto determinado al seleccionar un checkbox ?
es decir... si selecciono el checkbox "suma" me limpie el campo de texto "resultado resta"...
y si selecciono el checkbox "resta", me limpie "resultado suma"

asi solo queda el resultado de acuerdo al checkbox seleccionado

Gracias.-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>

<script>
function Sumaraa(a1, a2, result)
{
var objCamp1=document.getElementById(a1);
var objCamp2=document.getElementById(a2);
var objreult=document.getElementById(result);

var val1 = objCamp1.value;
if (!val1 || val1==''){
val1 = "0"; //...o el valor que le quieras dar por defecto
}
val1 = parseFloat(val1);

var val2 = objCamp2.value;
if (!val2 || val2==''){
val2 = "0"; //...o el valor que le quieras dar por defecto
}
val2 = parseFloat(val2);

objreult.value=parseFloat(val1) + parseFloat(val2);

}
// parseInt (numero entero)
// parseFloat (numero decimales ---> "." punto separa decimales)

function restarr(a1, a2, result)
{
var objCamp1=document.getElementById(a1);
var objCamp2=document.getElementById(a2);
var objreult=document.getElementById(result);

var val1 = objCamp1.value;
if (!val1 || val1==''){
val1 = "0"; //...o el valor que le quieras dar por defecto
}
val1 = parseFloat(val1);

var val2 = objCamp2.value;
if (!val2 || val2==''){
val2 = "0"; //...o el valor que le quieras dar por defecto
}
val2 = parseFloat(val2);

objreult.value=parseFloat(val1) - parseFloat(val2);

}

</script>

</head>

<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input name="Sumar1" type="text" id="Sumar1" />
valor 1 <br />
<input name="Sumar2" type="text" id="Sumar2" />
valor 2 <br />
<input name="radiobutton" type="radio" value="radiobutton" onclick="Sumaraa('Sumar1','Sumar2','resultado');"/>
suma
<br />
<input name="radiobutton" type="radio" value="radiobutton" onclick="restarr('Sumar1','Sumar2','resultado_rest a');"/>
resta
<br />
<br />
resultado suma
<input name="resultado" type="text" id="resultado" />
<br />
resultado resta
<input name="resultado_resta" type="text" id="resultado_resta" />
<br />
</label>
</form>
</body>
</html>

mhax · #4 (**permalink**) 10/04/2010, 21:36

en la funcion restar antes de hacer la operacion limpia el cuadro de texto:

Código JAVASCRIPT:

Ver originalfunction restar(){
 document.getElementById("resultado_suma").value="";
  ....
}

y en la funcion suma igual

Código JAVASCRIPT:

Ver originalfunction suma(){
document.getElementById("resultado_resta").value="";
}

icarocu · #5 (**permalink**) 10/04/2010, 22:07

grande mhax...
funciona perfecto !!
gracias.