Sumar y multiplicar id
Una vez me ayudaste a sumar campos con id y fue todo bien. Ahora quisiera multiplicar id y luego sumar totales. Me pasaste esta función:
<script language="JavaScript" type="text/JavaScript">
<!--
function valorASumar(queCheck){
var check= document.getElementById(queCheck);
return check.checked?new Number(check.value):0;
}
function sumar(){
var total = 0;
total+=valorASumar("80x60");
total+=valorASumar("100x80");
total+=valorASumar("150x105");
total+=valorASumar("200x125");
return total;
}
function ponerValor(){
document.getElementById("precioTotal").value = sumar();
}
//-->
</script>
Y el botón tenía
<input type="button" value="SUMAR" onClick="ponerValor()">
Lo de sumar está claro. Ahora quiero multiplicar varios campos y quiero que el resultado no aparezca al apretar un botón sino al hacer clic en una casilla de verificación.
<script language="JavaScript" type="text/JavaScript">
<!--
function valorASumar(queCheck){
var check= document.getElementById(queCheck);
return check.checked?new Number(check.value):0;
}
function sumar(){
var total = 0;
total+=valorASumar("80x60");
total+=valorASumar("100x80");
total+=valorASumar("150x105");
total+=valorASumar("200x125");
return total;
}
function ponerValor(){
document.getElementById("precioTotal").value = sumar();
}
//-->
</script>
Y el botón tenía
<input type="button" value="SUMAR" onClick="ponerValor()">
Lo de sumar está claro. Ahora quiero multiplicar varios campos y quiero que el resultado no aparezca al apretar un botón sino al hacer clic en una casilla de verificación.
1 respuesta
Respuesta de gandalf26
1
Algo así:
function multiplicar(){
var total = 0;
total*=valorASumar("80x60");
total*=valorASumar("100x80");
total*=valorASumar("150x105");
total*=valorASumar("200x125");
return total;
}
function ponerValor(){
document.getElementById("precioTotal").value = multiplicar();
}
La función valorASumar la puedes dejar igual :D
Y lo de llamarlo cuando se hace click en una casilla, simplemente ponle un:
onClick="ponerValor()"
A la casilla y listo.
function multiplicar(){
var total = 0;
total*=valorASumar("80x60");
total*=valorASumar("100x80");
total*=valorASumar("150x105");
total*=valorASumar("200x125");
return total;
}
function ponerValor(){
document.getElementById("precioTotal").value = multiplicar();
}
La función valorASumar la puedes dejar igual :D
Y lo de llamarlo cuando se hace click en una casilla, simplemente ponle un:
onClick="ponerValor()"
A la casilla y listo.
Hola Gandalf,
mira, muchas gracias, pero creo que no me he explicado bien. Mira el ejemplo en : http://www.replyclas.com/newyork.htm
Ahí viene que cuando un usuario le da a un cuadro de verificación se ha multiplicar el precio por la cantidad que éste ponga a la derecha (por defecto 1) y ponerlo en la celda TOTAL. Al final se ha de sumar todo automáticamente, sin tener que darle a ningún botón.
Espero haberme explicado ahora mejor :).
Gracias de nuevo.
mira, muchas gracias, pero creo que no me he explicado bien. Mira el ejemplo en : http://www.replyclas.com/newyork.htm
Ahí viene que cuando un usuario le da a un cuadro de verificación se ha multiplicar el precio por la cantidad que éste ponga a la derecha (por defecto 1) y ponerlo en la celda TOTAL. Al final se ha de sumar todo automáticamente, sin tener que darle a ningún botón.
Espero haberme explicado ahora mejor :).
Gracias de nuevo.
Como parece que es algo complicado he variado la página. Ahora solamente suma, lo que pasa es que la suma me desaparece del campo de texto inmediatamente, hace como un refresco de la página, ¿sabes por qué?
http://www.replyclas.com/newyork.htm
Muchas gracias.
http://www.replyclas.com/newyork.htm
Muchas gracias.
A ver si este ejemplo te vale, pero no te acostumbres ;) je je
Saludos
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="estilos.css" rel="stylesheet" type="text/css">
<SCRIPT LANGUAGE="JavaScript">
<!--
var ancho_pantalla=screen.availWidth;
var alto_pantalla=screen.availHeight;
window.resizeTo(750+25, 400+80);
var alto=(alto_pantalla-400)/2;
var ancho=(ancho_pantalla-750)/2;
window.moveTo(ancho,alto);
//-->
</SCRIPT>
<script language="JavaScript" type="text/JavaScript">
<!--
function valorASumar(queCheck){
var check= document.getElementById(queCheck);
if(check.checked){
var cantidad= document.getElementById("cant"+queCheck);
var subtotal = check.value*cantidad.value;
subtotal = Math.round(subtotal*100)/100; //redondeo a dos decimales...
document.getElementById("t"+queCheck).value=subtotal;
return subtotal;
}
else{
document.getElementById("t"+queCheck).value = 0;
return 0;
}
}
function sumar(){
var total = 0;
total+=valorASumar("80x60");
total+=valorASumar("100x80");
total+=valorASumar("150x105");
total+=valorASumar("200x125");
return Math.round(total*100)/100; //redondeo a dos decimales...;
}
function ponerValor(){
document.getElementById("total").value = sumar();
}
//-->
</script>
</head>
<body>
<form name="form1" method="post" action="">
<table width="528" border="0" class="txt">
<tr>
<td colspan="2" class="txt">Descripción<br>
</td>
<td width="175" rowspan="3"><img src="compra-cuadros/img-gran/landscape/Wiggins_Guy_Winter_New_York.jpg" width="276" height="208"></td>
</tr>
<tr>
<td colspan="2" class="txtnegrita">Wiggins Guy Winter New York</td>
</tr>
<tr>
<td colspan="2" align="right"><table width="100%" border="0">
<tr>
<td width="35%" align="right">Tamaño</td>
<td width="20%">Cantidad</td>
<td width="26%">Precio/un.</td>
<td width="19%">Total</td>
</tr>
<tr>
<td align="right">80x60
<input onClick="ponerValor()" name="80x60" type="checkbox" id="80x60" value="68.4"></td>
<td><input onChange="ponerValor()" name="cant80x60" type="text" id="cant80x60" value="1" size="3" maxlength="3"></td>
<td>68,40?</td>
<td><input name="t1" type="text" id="t80x60" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">100x80
<input onClick="ponerValor()" name="100x80" type="checkbox" id="100x80" value="115.2"></td>
<td><input onChange="ponerValor()" name="cant100x80" type="text" id="cant100x80" value="1" size="3" maxlength="3"></td>
<td>115,2?</td>
<td><input name="t2" type="text" id="t100x80" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">150x105
<input onClick="ponerValor()" name="150x105" type="checkbox" id="150x105" value="214.2"></td>
<td><input onChange="ponerValor()" name="cant150x105" type="text" id="cant150x105" value="1" size="3" maxlength="3"></td>
<td>214,20?</td>
<td><input name="t3" type="text" id="t150x105" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">200x125
<input onClick="ponerValor()" name="200x125" type="checkbox" id="200x125" value="342"></td>
<td><input onChange="ponerValor()" name="cant200x125" type="text" id="cant200x125" value="1" size="3" maxlength="3"></td>
<td>342 ? </td>
<td><input name="t4" type="text" id="t200x125" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right"> </td>
<td> </td>
<td>Precio final</td>
<td><input name="t12" type="text" id="total" size="5" maxlength="5"></td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2"> </td>
<td> </td>
</tr>
<tr>
<td colspan="2"> </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
Saludos
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="estilos.css" rel="stylesheet" type="text/css">
<SCRIPT LANGUAGE="JavaScript">
<!--
var ancho_pantalla=screen.availWidth;
var alto_pantalla=screen.availHeight;
window.resizeTo(750+25, 400+80);
var alto=(alto_pantalla-400)/2;
var ancho=(ancho_pantalla-750)/2;
window.moveTo(ancho,alto);
//-->
</SCRIPT>
<script language="JavaScript" type="text/JavaScript">
<!--
function valorASumar(queCheck){
var check= document.getElementById(queCheck);
if(check.checked){
var cantidad= document.getElementById("cant"+queCheck);
var subtotal = check.value*cantidad.value;
subtotal = Math.round(subtotal*100)/100; //redondeo a dos decimales...
document.getElementById("t"+queCheck).value=subtotal;
return subtotal;
}
else{
document.getElementById("t"+queCheck).value = 0;
return 0;
}
}
function sumar(){
var total = 0;
total+=valorASumar("80x60");
total+=valorASumar("100x80");
total+=valorASumar("150x105");
total+=valorASumar("200x125");
return Math.round(total*100)/100; //redondeo a dos decimales...;
}
function ponerValor(){
document.getElementById("total").value = sumar();
}
//-->
</script>
</head>
<body>
<form name="form1" method="post" action="">
<table width="528" border="0" class="txt">
<tr>
<td colspan="2" class="txt">Descripción<br>
</td>
<td width="175" rowspan="3"><img src="compra-cuadros/img-gran/landscape/Wiggins_Guy_Winter_New_York.jpg" width="276" height="208"></td>
</tr>
<tr>
<td colspan="2" class="txtnegrita">Wiggins Guy Winter New York</td>
</tr>
<tr>
<td colspan="2" align="right"><table width="100%" border="0">
<tr>
<td width="35%" align="right">Tamaño</td>
<td width="20%">Cantidad</td>
<td width="26%">Precio/un.</td>
<td width="19%">Total</td>
</tr>
<tr>
<td align="right">80x60
<input onClick="ponerValor()" name="80x60" type="checkbox" id="80x60" value="68.4"></td>
<td><input onChange="ponerValor()" name="cant80x60" type="text" id="cant80x60" value="1" size="3" maxlength="3"></td>
<td>68,40?</td>
<td><input name="t1" type="text" id="t80x60" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">100x80
<input onClick="ponerValor()" name="100x80" type="checkbox" id="100x80" value="115.2"></td>
<td><input onChange="ponerValor()" name="cant100x80" type="text" id="cant100x80" value="1" size="3" maxlength="3"></td>
<td>115,2?</td>
<td><input name="t2" type="text" id="t100x80" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">150x105
<input onClick="ponerValor()" name="150x105" type="checkbox" id="150x105" value="214.2"></td>
<td><input onChange="ponerValor()" name="cant150x105" type="text" id="cant150x105" value="1" size="3" maxlength="3"></td>
<td>214,20?</td>
<td><input name="t3" type="text" id="t150x105" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right">200x125
<input onClick="ponerValor()" name="200x125" type="checkbox" id="200x125" value="342"></td>
<td><input onChange="ponerValor()" name="cant200x125" type="text" id="cant200x125" value="1" size="3" maxlength="3"></td>
<td>342 ? </td>
<td><input name="t4" type="text" id="t200x125" size="5" maxlength="5"></td>
</tr>
<tr>
<td align="right"> </td>
<td> </td>
<td>Precio final</td>
<td><input name="t12" type="text" id="total" size="5" maxlength="5"></td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2"> </td>
<td> </td>
</tr>
<tr>
<td colspan="2"> </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
