Hola como etsan: estoy comenzando con algo de javascript/jquery y tengo el siguiente problema que resolver: tengo una tabla en la cual las filas las voy llenando con datos de productos que vienen de mi base de datos, en dicha tabla tengo uan columna con cantidad de productos y otra columna con valor del producto y lo que necesito es que al cargar la vista me traiga el valor calculado en cada fila (es decir multiplicar la cantidad de producto * el valor) y colocarlos en el input TOTAL...
Haciendo una prueba con el script que dejo a continuacion veo por consola que efectivamente me hace la suma de los 2 inputs, pero me pinta el mismo valor(el utlimo) en el input de los totales en las filas:
El script lo tengo asi hasta ahora:
<script>
//DECLARAMOS LAS VARIABLES PARA LOS CALCULOS
var subtotal = 0;
var descuento = 0;
var impuesto = 0;
var total = 0;
//LLAMAMOS A LA FUNCION QUE HACE LOS CALCULOS
valores();
function valores(){
$('#productos tr').each(function(){
let total_celdas_cantidad = $(this).find('input[type="number"]').val();
let total_celdas_valores = $(this).find('input[type="text"]').val();
var valor_total_fila = total_celdas_cantidad * total_celdas_valores;
console.log(valor_total_fila);
$(".total_producto_tabla").val(valor_total_fila);
// $("#total_producto_tabla").val(valor_total_fila);
//CALCULA EL SUBTOTAL SUMANDO LOS TTOALES DE LOS PRODUCTOS COTIZADOS
subtotal += valor_total_fila;
$('#monto_subtotal').val(subtotal);
});
}
</script>
y el codigo de mi vista (la parte de la tabla en concreto) es esta:
<div class="card">
<div class="card-body">
<div class="row">
<h5>Productos Solicitados en el Pedido</h5>
</div>
<br>
<div class="row">
<table id="productos" class="table table-striped table-bordered table-condensed table-hover">
<thead >
<th style="width:25%">Producto</th>
<th >SKU</th>
<th>Cantidad Solicitada</th>
<th>Valor Unitario</th>
<th>Total</th>
</thead>
<tfoot></tfoot>
@foreach($detallePedido as $detalle)
<tr onkeyup="valores(this)">
<td>{{$detalle->nombre_producto}}</td>
<td>{{$detalle->sku}}</td>
<td><input type="number" class="cantidad_producto form-control" value="{{$detalle->cantidad}}" /> </td>
<td><input type="text" class="valor_neto form-control" value="{{$detalle->valor_neto}}" readonly /> </td>
<td><input type="text" class="form-control total_producto_tabla" readonly></td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</script>
Saludos a todos