Suma y resta Array con Jquery

[calbornozd]

Estimados,
recurro a ustedes para ver quien me podria orientar un poco.
Mi problema es el siguiente, resulta que genero un array de input dependiendo de los dias del mes, 28 input si es febrero 31 input si es julio, para que quede claro.
Resulta que esto input los voy generando en una tabla donde manejo 4 input dinamicos.

Estos input los necesito sumar y restar de forma automatica,

<form id="controlprovisiones" name="controlprovisiones" method="POST" enctype="multipart/form-data">
<table>
<tr>

<td><? echo $day ?></td>

<td><input style="width: 80px" type="text" name="provisionado[]" id="provisionado"></td>

<td><input style="width: 80px" type="text" name="siniestrado_s[]" id="siniestrado_s"></td>


<td><input style="width: 80px" type="text" name="pagado_s[]" id="pagado_s"></td>

<td><input style="width: 80px" type="text" name="rechazos_s[]" id="rechazos_s"></td>

<td><input style="width: 80px" type="text" name="pendientes" id="pendientes"></td>

</table></form>

Mi función JQUERY
$(document).ready(function (){
$("input[type='text']").change(function total_suma(){
var suma = 0;
suma = Number($("textarea[name^='provisionado']").val());
suma += Number($("textarea[name^='siniestrado_s']").val());
suma -= Number($("textarea[name^='pagado_s']").val());
suma -= Number($("textarea[name^='rechazos_s']").val());
document.controlprovisiones.pendientes.value = (suma);
});
});

Lo que trato de hacer es sumar el input provisionado + siniestrado_s-pagados_s - rechazos_s
De forma automatica sin tener que utilizar un submit para que realize dicha operación matematica.

Espero que me ayuden con este tema por favor ya que me tiene muy complicado y no hayo la forma de realizarlo.

Saludos!

[alberto510a]

Para empezar agradecería que el var suma = 0 lo pusieras fuera del .change() sino cada vez que cambias un input tu cuenta se reinicia y luego no te entendí muy bien que problema tienes. Si quieres mostrar el valor de tu suma tan solo tienes que atribuírselo a cualquier otro input.

Saludos!

[calbornozd]

Gracias alberto510a por responder,
el problema es que necesito sumar y restar de forma real osea que cuando valla agregando valores en los input, en otro input llamado total vaya realizando el calculo.

Lo que trato de hacer es la siguiente operación matematica "provisionado + siniestrado_s-pagados_s - rechazos_s"

El resultado me lo tiene que dar de forma real e instantanea y no tener que realizar dicho calculo presionando un botton.

Ojala quede mas claro el problema.

Saludos

[alberto510a]

Fijate en este ejemplo solo hay que hacer eventos para cuando se pulsa las teclas:

Código Javascript:

<script>
function sumar(){
    a = parseInt(document.getElementById('1').value);
    b = parseInt(document.getElementById('2').value);
    document.getElementById('total').value = a+b;
}
</script>
 

Código HTML:

<input type="text" onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando1" id="1">
<input type="text" onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando2" id="2">
<input type="text" disabled placeholder="total" id="total">
 

[calbornozd]

alberto510a
En el ejemplo que mandaste esta super bueno, pero aun no puedo lograr ir sumando los demas input dinamicos que se generan en la segunda linea y sucesivamente, ya que me suman la primera linea de input.

Código PHP:

  <?
                /*  Set some variables  */
                $date=01;
                $day=01;
                $off=0;
                 
                /*  The month and year variables can (should) be passed from a preceding
                    web page rather than hard coded  */
                $month = $_POST['mes'];
                $year = $_POST['anio'];
                 
                /*  Figure out how many days are in this month  */
                while (checkdate($month,$date,$year)):
                $date++;
                endwhile;
                ?>
<?
                while ($day<$date):
                 
                ?>
                <tr>
 
<td><? echo $day ?></td>
    <td><input  type="text" name="pendientes" ></td>
    <td><input  type="text" name="provisionado[]"  onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando1" id="1"></td>
    <td><input  type="text" name="siniestrado_q[]" ></td>
    <td><input  type="text" name="siniestrado_s[]"  onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando1" id="2"></td>
    <td><input  type="text" name="pagado_q[]" ></td>
    <td><input  type="text" name="pagado_s[]"  onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando1" id="3"></td>
    <td><input type="text" name="rechazos_q[]" ></td>
    <td><input type="text" name="rechazos_s[]" onKeyDown="sumar();" onKeyUp="sumar();" onkeypress="sumar();" placeholder="sumando1" id="4"></td>
<? 
                /*  Increment the day and increment the cells that go before the end of the row
                    and end the row when appropriate */
                $day++;
                $off++;
                 
                                 
                endwhile;
                
                
                ?>   

Como para entender mejor el problema tengo 28 input que se generan dinamicamente en relación a los dias del mes, este caso febrero que tiene 28 días. Necesito sumar y restar los 28 input para el final mandarlo como un total.
Lo que trato de hacer es la siguiente operación matematica "provisionado + siniestrado_s - pagados_s - rechazos_s"

[alberto510a]

Yo ahí poco puedo ver jaja. Dime exactamente que no entiendes o cual es tu error.

[calbornozd]

que la función Javascript funciona con la primera fila que se genera con los input dinamicos, con las demas filas de la tabla no funciona.
Estas filas se generan en relación a las cantidad de los dias del mes.
En este caso serian 28 filas si corresponde al mes de febrero y cada fila tiene 4 celdas con sus input generados dinamicamente.

No tengo conocimiento de como poder aplicar dicha función javascript para que me tome todas las filas con sus input

[alberto510a]

A ver si nos queda una cosa clara, si tus input son generados dinámicamente (no están desde el principio cuando alguien entra a esa url, son traidos por ajax, jquery o lo que sea) no puedes aplicarle eventos a ellos, si es así es lógico que no te funcione.

Para aplicar eventos a elementos que vienen dinámicamente debes usar el método on() de jQuery.

Para hacer que al suceder un evento en un elemento que viene dinámicamente ocurra algo tienes que apoyarte en su padre, ejemplo:

Tienes un div que se llama de id "a". Dentro de ese div vamos a traer un input que se llame de id "b" y tu quieres aplicar un evento a ese input. Pues nos tenemos que apoyar en su padre "a".

Código Javascript:

$(".a").on("change",".b",function(){
//lo que sea
});
 

[calbornozd]

Encontre una solución pero el tema es que no entiendo porque la función Javascript no funciona con Internet Explorer pero si con Mozilla


[JAVASCRIPT]
function AddItem() {
var tbody = null;
var tabla = document.getElementById("tabla");
var nodes = tabla.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].nodeName == 'TBODY') {
tbody = nodes[x];
break;
}
}
if (tbody != null) {
var tr = document.createElement('tr');
tr.innerHTML = '<td><input type="text" name="item[]"/></td><td><input type="text" name="cantidad[]" onChange="Calcular(this);" value="1" /></td><td><input type="text" name="precunit[]" onChange="Calcular(this);" value="0"/></td><td><input type="text" name="totalitem[]" readonly /></td>';
tbody.appendChild(tr);
}
}

function Calcular(ele) {
var cantidad = 0, precunit = 0, totalitem = 0;
var tr = ele.parentNode.parentNode;
var nodes = tr.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].firstChild.name == 'cantidad[]') {
cantidad = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'precunit[]') {
precunit = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'totalitem[]') {
totalitem = parseFloat((precunit*cantidad),10);
nodes[x].firstChild.value = totalitem;
}
}
var total = document.getElementById("total");
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}

[/JAVASCRIPT]

Código HTML:

<form name="frmitems" id="frmitems" action="recibe221.php" method="POST">
	<div id="contenedor">
		<table id="tabla">
			<thead>
				<tr>
					<th>Item</th>
					<th>Cantidad</th>
					<th>Precio Unitario</th>
					<th>Total</th>
				</tr>
			</thead>
			<tbody>
				
			</tbody>
			<tfoot>
				<tr>
					<td>Total</td>
					<td>&nbsp;</td>
					<td>&nbsp;</td>
					<td><span id="total">0</span></td>
				</tr>
			</tfoot>
		</table>
		<button type="button" onClick="AddItem();">Agregar item.</button>
	</div>
	<input type="submit" value="Enviar" />
</form> 

por si me pueden ayudar a buscar el porque...
Ante mano se agradeceria