[SOLUCIONADO] Click Añade siempre el mism producto

[rutame]

Hola amigos!

Estoy haciendo un carrito que añada productos usando jquery ajax. Cuando hago click en el botón (de un formulario) añade el producto, pero siempre el mismo, ¿por qué?
Y mirando con el firebug veo que siempre pasa los mismos parámetros..
Este es el código jquery

Código Javascript:

<script>
$(document).ready(function(){
          
     $(".add").on("click",function(){
     
          var idpieza = $(".idpie").val();
          var precio = $(".precio").val();
          var cantidad = $(".cantidad").val();
          
          $.ajax
          ({
               type: "POST",
               url: "carrito_idproducto.php",
               data: {idpie:idpieza, precio:precio, cantidad:cantidad},
               success: function(data)
               {
                    $("#carrito").html(data);
                    
               }
          });
          return false; // Evita ejecutar el submit del formulario
     });
 
});    
</script>
 

Muchas gracias
PD: Siempre doy puntos a las buenas respuestas.

[PHPeros]

No entiendo... Ahí le estás pasando los tres valores recogidos de los campos de texto ¿no?

[Eleazan]

Buenas,

El problema está aqui:

Código Javascript:

var idpieza = $(".idpie").val();
var precio = $(".precio").val();
var cantidad = $(".cantidad").val();
 

Deduzco que siempre te mete el primer producto. Si pruebas eso en la consola, verás que $(".idpie") es un array de TODOS los producros. Siempre seleccionará el primero.

Yo, personalmente, suelo jugar con un atributo en el boton, por ejemplo

Código HTML:

<a class="btn btn-primary add" data-id="215">Guardar</a> 

Y a los campos, llamarlos así

Código HTML:

<input type="text" id="cantidad_215"> 

(Añadiendo _ID en cada id del campo!)

Y tu funcion js podría ser así:

Código Javascript:

$(document).ready(function(){
          
     $(".add").on("click",function(){
          var idpieza = $(this).attr('data-id');
         
          var precio = $("#precio_"+idpieza).val();
          var cantidad = $("#cantidad_"+idpieza).val();
          
          $.ajax
          ({
               type: "POST",
               url: "carrito_idproducto.php",
               data: {idpie:idpieza, precio:precio, cantidad:cantidad},
               success: function(data)
               {
                    $("#carrito").html(data);
                    
               }
          });
          return false; // Evita ejecutar el submit del formulario
     });
 
});
 

Almenos, yo suelo usar algo así :)

Saludos!

EDIT: Por cierto, el "precio" no deberias pasarlo, solo cantidad e id... y luego pillar el precio de la bbdd... sino, algún avispadito te lo cambiará! (Y todo depende de que sea tu app, claro!)