Sumar o restar dependiendo de checkbox
Espero me puedas 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 más...("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>
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 más...("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>
1 respuesta
Respuesta de krlosnow
1
Claro que se puede:
<html>
<head>
<script>
function doOperacion(op){
//Reseteo las cajas de texto donde meter el resultado
document.getElementById("resSuma").value="";
document.getElementById("resResta").value="";
var op1, op2;
op1 = parseInt(document.getElementById("operando1").value);
if (isNaN(op1)){op1 = 0;}
op2 = parseInt(document.getElementById("operando2").value);
if (isNaN(op2)){op2 = 0;}
if (op=="suma"){
document.getElementById("resSuma").value= op1 + op2;
}
else if (op=="resta"){
document.getElementById("resResta").value= op1 - op2;
}
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="operando1" id="operando1" />
valor 1 <br />
<input type="text" name="operando2" id="operando2" />
valor 2 <br />
<input name="operacion" id="operacionSuma" type="radio" value="suma" onClick="doOperacion('suma')"/>
suma
<br />
<input name="operacion" id="operacionResta" type="radio" value="resta" onClick="doOperacion('resta')"/>
resta
<br />
<br />
resultado suma
<input type="text" name="resSuma" id="resSuma" />
<br />
resultado resta
<input type="text" name="resResta" id="resResta"/>
<br />
</label>
</form>
</body>
</html>
<html>
<head>
<script>
function doOperacion(op){
//Reseteo las cajas de texto donde meter el resultado
document.getElementById("resSuma").value="";
document.getElementById("resResta").value="";
var op1, op2;
op1 = parseInt(document.getElementById("operando1").value);
if (isNaN(op1)){op1 = 0;}
op2 = parseInt(document.getElementById("operando2").value);
if (isNaN(op2)){op2 = 0;}
if (op=="suma"){
document.getElementById("resSuma").value= op1 + op2;
}
else if (op=="resta"){
document.getElementById("resResta").value= op1 - op2;
}
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="operando1" id="operando1" />
valor 1 <br />
<input type="text" name="operando2" id="operando2" />
valor 2 <br />
<input name="operacion" id="operacionSuma" type="radio" value="suma" onClick="doOperacion('suma')"/>
suma
<br />
<input name="operacion" id="operacionResta" type="radio" value="resta" onClick="doOperacion('resta')"/>
resta
<br />
<br />
resultado suma
<input type="text" name="resSuma" id="resSuma" />
<br />
resultado resta
<input type="text" name="resResta" id="resResta"/>
<br />
</label>
</form>
</body>
</html>
