[SOLUCIONADO] input dinamico con eventos onkeyup de multiplicar

[EdyArgueta]

Buenas a todos soy nuevo con el javascript y estoy tratando de hacer un formulario dinamico el que agrege 3 inputs a precionar un boton.

Al escribir numeros en los dos primeros inputs que se llamaran "cantidad" y "precio" multiplicara automáticamente y mostrara el resultado en "total" el tercer input

1- los dos primeros inputs tienen un evento onkeyup el cual seria:

Input cantidad

Código HTML:

<input type="text" name="c[]" id="1" onkeyup="if(agregar.precio.value!=""){agregar.total.value = parseInt(this.value)*parseInt(agregar.precio.value)') "> 

Input precio

Código HTML:

<input type="text" name="c[]" id="1" onkeyup="if(agregar.cantidad.value!=""){agregar.total.value = parseInt(this.value)*parseInt(agregar.cantidad.value)') "> 

Mas o menos ese seria el resultado que necesito pero como son dinamicos la id cambia y necesito que cambie el nombre el codigo java que utilizo es el siguiente para crear los inputs

Código:

<script type="text/javascript">

icremento =0;
function crear(obj) {
icremento++;

field = document.getElementById('field'); 
contenedor = document.createElement('div'); 
contenedor.id = 'div'+icremento; 
field.appendChild(contenedor);

boton = document.createElement('input');
boton.type = 'text';
boton.name = 'c'+'[]';
boton.id = +icremento;
boton.size='5';
boton.setAttribute('onKeyUp', 'if(agregar.precio.value!=""){agregar.total.value = parseInt(this.value)*parseInt(agregar.precio.value)');
contenedor.appendChild(boton); 

boton = document.createElement('input');
boton.type = 'text';
boton.name = 'p'+'[]';
boton.id = +icremento;
boton.size='5';
boton.setAttribute('onKeyUp', 'if(agregar.cantidad.value!=""){agregar.total.value = parseInt(this.value)*parseInt(agregar.cantidad.value)');
contenedor.appendChild(boton); 

}

El problema que tengo es como decirle que multiplique cada linea nueva que se cree, ya que tampoco puedo hacer que cambien el id en el codigo onkeyup no se si estoy por buen camino o la forma que utilizo no es la correcta.

alguien podria indicarme que puedo hacer o metodo utilizar ya que el codigo para crear los inputs dinámicos a sido a mi parecer el mejor que e logrado a comprender.

muchas gracias.

[ArturoGallegos]

Andas de suerte, justo ando trabajando en una calculadora... no es igual pero reciclando algo de código casi seguro que te sirve, revisalo.

-> link a codigo y demo

[EdyArgueta]

Muy buena calculadora la probé y si realmente es una mejor forma de aplicar el proceso de calcular en java y no en los inputs, pero sigo con la gran interrogante ya sea tu metodo o el que use anterior mente como hago que javascript calcule los dos inputs que se creen cada ves que precione un boton, recuerda que son dinamicos asi que tendria algo asi

Código HTML:

<input type="button" value="Crear fila" onClick="crear(this)">

<div class="mydiv1">
        <input type="text" name="cantidad[]" />
        <input type="text" name="precio[]" />
        <input type="text" name="total[]" readonly="" />

 </div>

<div class="mydiv2">
        <input type="text" name="cantidad[]" />
        <input type="text" name="precio[]" />
        <input type="text" name="total[]" readonly="" />

 </div>

<div class="mydiv3">
etc..
 </div> 

[ArturoGallegos]

?¿ a ver, como que ya no entendí que buscas.... Que necesitas que calcule javascript al presionar el botón?

Pensé que este solo crearía una nueva linea con los 3 campos y estos deberían poder hacer de calculadora, cantidad*precio=total


?¿ hay algo de lo que me estoy perdiendo o no logro captar?

[EdyArgueta]

jejeje si creo que no explique bien pero ya tengo la solucion este es el resultado que esperaba y su solucion.



yo tengo un boton que crea inputs, estos son cantidad precio y total osea que tendre esos inputs idefinidamente repetidos, la idea es multiplicar cantidad por precio automaticamente tenia un codigo para multiplicar pero al ser dinamicos los inputs los creo por medio de javascript el detalle era que no sabia como ingresar ese codigo que multiplica a los inputs por java... asi que el resultado fue este

Código:

<script type="text/javascript">

icremento =0;
function crear(obj) {
icremento++;
field = document.getElementById('field'); 
contenedor = document.createElement('div'); 
contenedor.id = 'div'+icremento; 
field.appendChild(contenedor);

var calculoc = 'if(agregar.p'+ +icremento +'.value!=""){agregar.t'+ +icremento +'.value = parseFloat(this.value)*parseFloat(agregar.p'+ +icremento +'.value)}' ;
var calculop = 'if(agregar.c'+ +icremento +'.value!=""){agregar.t'+ +icremento +'.value = parseFloat(this.value)*parseFloat(agregar.c'+ +icremento +'.value)}' ;

boton = document.createElement('input');
boton.type = 'text';
boton.id = 'c'+icremento; 
boton.name = 'c'+'[]';
boton.size='5';
boton.setAttribute('onKeyUp',calculoc);
contenedor.appendChild(boton); 

boton = document.createElement('input'); 
boton.type = 'text'; 
boton.name = 'd'+'[]'; 
boton.size='48';
boton.required=true;
contenedor.appendChild(boton);

boton = document.createElement('input'); 
boton.type = 'text'; 
boton.name = 'm'+'[]'; 
boton.size='6';
contenedor.appendChild(boton);

boton = document.createElement('input'); 
boton.type = 'text';
boton.id = 'p'+icremento;
boton.setAttribute('onKeyUp',calculop);
boton.name = 'p'+'[]'; 
boton.size='6';
boton.required=true;
contenedor.appendChild(boton);

boton = document.createElement('input'); 
boton.type = 'text';
boton.id = 't'+icremento; 
boton.name = 't'+'[]'; 
boton.size='6';
boton.required=true;
boton.readOnly=true;
contenedor.appendChild(boton);

boton = document.createElement('input'); 
boton.type = 'button'; 
boton.value = 'Borrar'; 
boton.name = 'div'+icremento; 
boton.onclick = function () {borrar(this.name)} 
contenedor.appendChild(boton); 

}
function borrar(obj) {
field = document.getElementById('field'); 
field.removeChild(document.getElementById(obj)); 
}
</script>

basicamente era error de sintaxis, pero gracias por tu ayuda y tiempo igual le dare uso a tu codigo