Acciones concatenadas

caledonia11 · #1 (**permalink**) 05/09/2007, 04:32

Hola a todos, a ver si alguien me puede echar una manita con este sencillo script. Busco que al introducir los datos en las celdas, me calcule automaticamente los dos valores finales, el precio por linea y el precio total. Solo he conseguido que lo haga de dos pasos y ademas teniendo que presionar con "onclick" dos botones diferentes y ademas uno detras de otro. Como podran comprobar es una especie de calculo de coste de dos productos. Muchisimas gracias por adelantado.

Codigo:

<html>
<head>

<script>
function calcula1(operacion){
var operando1 = document.calc.operando1.value
var operando2 = document.calc.operando2.value
var operando3 = document.calc.operando3.value
var result1 = eval(operando1 + operacion + operando3)
var result2 = eval(operando2 + operacion + operando3)
document.calc.resultado1.value = result1
document.calc.resultado2.value = result2

}

function calcula2(operacion){
var operando4 = document.calc.resultado1.value
var operando5 = document.calc.resultado2.value
var result3 = eval(operando4 + operacion + operando5)
document.calc.resultado3.value = result3

}

</script>

</head>

<body>

<br>

<form name="calc">

Numero Cajas V.Tinto:
<input type="Text" name="operando1" value="0" size="12"> <input type="Text" name="resultado1" value="0" size="12">
<br>

Numero Cajas V.Blanco:
<input type="Text" name="operando2" value="0" size="12"> <input type="Text" name="resultado2" value="0" size="12">
<br>

<input type="hidden" name="operando3" value="36" size="12">
<br>
<input type="Text" name="resultado3" value="0" size="12">
<input type="Button" name="" value=" Calcular Lineas " onChange="calcula1('*')">
<input type="Button" name="" value=" Calcular Total" onChange="calcula2('+')">
<br>

</form>

Adler · #2 (**permalink**) 05/09/2007, 05:19

Intenta evitar usar el mismo nombre para una variable y un campo.

var operando1 = document.calc.operando1.value

No vas a concatenar los elementos, sino sumarlos o multiplicarlos, así que sería suficiente

var result1 = (operando1 * operando3);
var result2 = (operando2 * operando3);

var result3 = (operando4 + operando5);

Suerte

derkenuke · #3 (**permalink**) 05/09/2007, 18:46

Hola.

Cita:

Iniciado por Adler

Intenta evitar usar el mismo nombre para una variable y un campo.

var operando1 = document.calc.operando1.value

No vas a concatenar los elementos, sino sumarlos o multiplicarlos, así que sería suficiente

var result1 = (operando1 * operando3);
var result2 = (operando2 * operando3);

var result3 = (operando4 + operando5);

Suerte

Supongo que no se debe usar el mismo nombre de variable que de campo, para no llevar a posible confusión, pero he de decirte que no da error y no hay problema en hacerlo. Por lo menos yo siempre lo he hecho así.

Por otra parte, si te fijas, el eval() es necesario en este caso porque lo que se pasa por argumento es la accion de la operación, es decir, si se suma o se multiplica (en forma de string). Lo que si es verdad es que no tiene mucho sentido si no vamos a reutilizar la misma función con distintas acciones: ponerlo directamente sería más cómodo.

Lo que me intriga es, ¿porque el evento asignado a los botones es onchange? Con onclick funciona perfectamente... ¿No te has dado cuenta que si metes un alert() en cualquiera de las funciones no se ejecuta? ¿Ni de que tampoco da ningún error aunque no funcione? Que yo sepa, un elemento button no tiene onchange...

Un saludo.

caledonia11 · #4 (**permalink**) 07/09/2007, 03:07

Muchas gracias Adler y Derkenuke por las respuestas.
Derkenuke, intentaba con el onchange que al cambiar de celda actualizara la informacion de todas ellas. Al final me he liado con tanta formula (por que ademas tenia que calcular el impuesto y el total, etc) y recurri a lo mas facil, googlear un formulario de calculo de subtotales y totales con impuestos y modificarlo a mi gusto. Pude solucionarlo y ya colgue la pagina con el formulario de pedidos en www.casillasdesatautey.com

Gracias de nuevo por todo
Abrazos

derkenuke · #5 (**permalink**) 07/09/2007, 07:18

Bien, sólo comentarte que utilizando el evento onchange sería tan sencillo como ésto:

Código PHP:

  <html> 
<head> 
 
 
<script> 
 
function actualizaPrecios() { 
    // Obtenemos los datos 
    var f = document.calc; 
    var cajasTinto = parseInt(f.operando1.value, 10); 
    var cajasBlanco = parseInt(f.operando2.value, 10); 
    var precioPorCaja = parseInt(f.operando3.value, 10); 
    // Calculamos los precios (parciales y finales) 
    var precioTinto = cajasTinto * precioPorCaja; 
    var precioBlanco = cajasBlanco * precioPorCaja; 
    var precioTotal = precioTinto + precioBlanco; 
    // Colocamos los datos en su sitio 
    f.resultado1.value = precioTinto+" €"; 
    f.resultado2.value = precioBlanco+" €"; 
    f.resultado3.value = precioTotal+" €"; 
} 
 
</script> 
 
 
</head> 
 
<body> 
 
 
<br> 
 
<form name="calc"> 
 
    Numero Cajas V.Tinto: 
    <input type="Text" name="operando1" value="0" size="12" onchange="actualizaPrecios()">  
    <input type="Text" disabled="disabled" name="resultado1" value="0 €" size="12"> 
    <br> 
 
    Numero Cajas V.Blanco: 
    <input type="Text" name="operando2" value="0" size="12" onchange="actualizaPrecios()">  
    <input type="Text" disabled="disabled" name="resultado2" value="0 €" size="12"> 
    <br> 
 
    Precio por caja: <input type="text" disabled="disabled" name="operando3" value="36 €" size="12"> 
    <br> 
    Precio total: <input type="Text" name="resultado3" disabled="disabled" value="0 €" size="12"> 
    <br> 
 
</form> 
</body> 
</html>

Y quizás te interese más utilizar onkeydown para las cajas, para que se cambie de verdad dinámicamente y no haya que salir del campo (blur) para actualizar.

¡No olvides comprobar que los campos sean números!

Un saludo.