tengo un inconveniente para sacar el total, en la funcion sacartotal solo me funciona con la primera fila, en las demás no funciona, la tabla será una tabla dinámica, agradecería su ayuda, a continuación adjunto el código HTML y JavaScript.
// funcion para vender por cantidad (mayor a 12 por docena).
// funciona gracias a esta comunidad.
document.addEventListener("DOMContentLoaded", function() {
document.getElementById("formulario").addEventListener('submit', validarFormulario);
});
function validarFormulario(evento) {
evento.preventDefault();
let cant_vm = parseFloat( document.getElementById("cant_vm").value );
let cant_actual = document.getElementsByClassName("cant_actual");
for(var i = 0; i < cant_actual.length; i++) {
if (parseFloat(cant_actual[i].value) < cant_vm) {
alert("Solo se vende en cantidad, mayor a "+ cant_vm)
cant_actual[i].focus()
return 0;
}
}
this.submit();
}
// despues de modificar la cantidad. onchange
// llamanos la funcion sacartotal
function actualizar_total() {
sacartotal();
}
// solo funciona con la primera fila
// sera una tabla dinaminca.
function sacartotal() {
let prec = document.getElementsByClassName("prec")[0].value;
let cant = parseFloat( document.getElementById("cant").value );
let resul = document.getElementById("resul").value = prec*cant;
}
<form action="echo.php" method="POST" id="formulario">
<table>
<tr>
<td>Producto</td>
<td>Precio</td>
<td>Cantidad</td>
<!-- <td>Act. Cant.</td> -->
<td>Total</td>
</tr>
<tbody>
<tr>
<td><input type="text" name="" value="TECLADO"></td>
<td><input type="text" name="" id="" value="50" class="prec"></td>
<td><input type="number" name="" id="cant" value="1" class="cant_actual"
onchange="actualizar_total()"></td>
<td><input type="text" name="" id="resul" value="50"></td>
</tr>
<tr>
<td><input type="text" name="" value="MOUSE"></td>
<td><input type="text" name="" id="" value="30" class="prec"></td>
<td><input type="number" name="" id="cant" value="1" class="cant_actual"
onchange="actualizar_total()"></td>
<td><input type="text" name="" id="resul" value="30"></td>
</tr>
<tr>
<td><input type="text" name="" value="PARLANTE"></td>
<td><input type="text" name="" id="" value="80" class="prec"></td>
<td><input type="number" name="" id="cant" value="1" class="cant_actual"
onchange="actualizar_total()"></td>
<td><input type="text" name="" id="resul" value="80"></td>
</tr>
</tbody>
</table>
<br>
<input class="btn" type="submit" value="Entrar">
</form>
<br>
<label>Solo se vende en cantidad, mayor a </label>
<input type="text" value="12" id="cant_vm">
saludos amigos, tengo un inconveniente para sacar el total, en la funcion sacartotal solo me funciona con la primera fila, en las demás no funciona, la tabla será una tabla dinámica, agradecería su ayuda, a continuación adjunto el código HTML y JavaScript.