Skip to main content
1 de 3

Veo dos problemas

El primero es que los id del html están pensados para identificar un único elemento del dom, como acá estás haciendo un @foreach, por cada <tr> que dibujas en la tabla repites los identificadores

Te aconsejo que cambies los id por class ej

<input type="number" class="form-control" name="precio_compra" id="precio_compra">

por

<input type="number" class="form-control js-precio-compra" name="precio_compra">

Por eso cuando haces precio_compra = $("#precio_compra").val(); en la función de agregar siempre toma el del primer <tr> de la tabla

Lo siguiente es que al clickear el botón "Agregar", limites la búsqueda de los valores a solo la fila en la que está el botón que presionaste, que impidas que jquery busque en todo el dom pues...

Cambia el id por clase en el botón de

<button type="button" id="agregar" class="btn btn-info float-right mt-1">Agregar</button>

a

<button type="button" class="btn btn-info float-right mt-1 js-agregar">Agregar</button>

Y luego en tu javascript escucha cuando se clickee la clase .js-agregar, haz que se llame la función agregar como callback, y le pasamos a la función qué fila queremos agregar

$(".js-agregar").on("click", function(){
    fila = $(this).closest("tr");
    agregar(fila);
});

En el on click que acabamos de hacer estamos obteniendo el elemento clickeado con $(this), osea el botón, y partiendo del botón buscamos la fila más cercana con .closest(), y teniendo el elemento de la fila se lo pasamos a la función agregar

Como ya tenemos la fila, podemos obtener ahora los valores de esa fila específica usando .find(), ocuparías modificar la función agregar para recibir el parametro fila

function agregar(fila) {
    articulo_id = fila.find(".js-articulo-id").val();
    articulo = fila.find(".js-articulo-nombre").val();
    cantidad = fila.find(".js-cantidad").val();
    precio_compra = fila.find(".js-precio-compra").val();

Closest! busca elementos padre del elemento seleccionado, y find! busca elementos hijos

Espero te sea de ayuda mi explicación!