Tengo este script que agrega un input y en el input total <input type="number" name="total" id="total" value="0">
no me suma el input que viene por default, el resto me los suma y no me arroja ningun error.
Me podrían ayudar a resolverlo?
index.php
$(document).ready(function() {
$(".add_item_btn").click(function(e) {
e.preventDefault();
$("#show_item").prepend(`<div class="append_item"><div>
<input type="text" name="product[]" required>
<input type="number" class="precio-input" name="precio[]" required>
<input type="number" class="cantidad-input" name="cantidad[]" required>
<button class="remove_item_btn">Quitar</button>
</div></div>`);
});
$(document).on('click', '.remove_item_btn', function(e) {
e.preventDefault();
let row_item = $(this).parent().parent();
$(row_item).remove();
});
$(document).on('input', '.precio-input, .cantidad-input', function() {
updateTotal();
});
function updateTotal() {
let total = 0;
$('.append_item').each(function(index, element) {
const precio = parseFloat($(element).find('.precio-input').val()) || 0;
const cantidad = parseFloat($(element).find('.cantidad-input').val()) || 0;
total += precio * cantidad;
});
$('#total').val(total.toFixed(2));
}
$("#add_form").submit(function(e) {
e.preventDefault();
$("#add_btn").val('Cargando...');
$.ajax({
url: 'action.php',
method: 'post',
data: $(this).serialize(),
success: function(response) {
console.log(response);
// $("#add_btn").val('Add');
// $("#add_form")[0].reset();
// $(".append_item").remove();
// $("#show_alert").html(`<div></div>`);
}
});
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="#" method="POST" id="add_form">
<div id="show_item">
<input type="text" name="product[]" required>
<input type="number" class="precio-input" name="precio[]" required>
<input type="number" class="cantidad-input" name="cantidad[]" required>
<button class="add_item_btn">Agregar</button>
</div>
<input type="number" name="total" id="total" value="0">
<input type="submit" value="add" id="add_btn">
</form>
action.php
<?php
print_r($_POST);
// $conn = new PDO('mysql:host=localhost;dbname=pruebas','root','');
// $code = rand();
// $fecha = date('Y-m-d');
// foreach($_POST['product'] as $key => $value){
// $sql = "INSERT INTO detalle (code, producto, precio, cantidad) VALUES (:code, :producto, :precio, :cantidad)";
// $stmt = $conn->prepare($sql);
// $stmt->execute([
// 'code' => $code,
// 'producto' => $value,
// 'precio' => $_POST['precio'][$key],
// 'cantidad' => $_POST['cantidad'][$key],
// ]);
// }
// $sql_venta = "INSERT INTO venta (code, fecha) VALUES (:code, :fecha)";
// $stmt_venta = $conn->prepare($sql_venta);
// $stmt_venta->execute(['code' => $code, 'fecha' => $fecha]);
// echo 'Ok';
echo $_POST['total'];
?>
Agradezco la ayuda de antemano!