Como captar solo un id de un div si se repiten muchos php ajax
Tengo un problema con mi codigo cuando intento captar el id de un div el cual se repite varias veces por que uso un foreach para crear la lista de productos y otro foreach para crear los modales para cada uno los inputs que tengo en el modal son talla color y cantidad pero al momento de agregar al carrito de compras solo se selecciona los valores del del primer modal necesito ayuda por que como el forech crea todos los div con el mismo id me pasa ese error
1 respuesta
Es normal que suceda eso, pues el Id debería ser único para cada elemento. Por lo que al pedir por script in elemento por ID, el navegador que ejecuta ese script espera solo encontrar un único elemento y toma el primero que encuentra.
Existen varias soluciones para tu problema, pero como no tengo el código a mano te sugeriré tres posibles soluciones soluciones:
Crea una variable a incrementar en el Ojo y adjuntarla a la id
Puedes concatenar un entero que vas incrementando cada vez que se repite el foreach en PHP y concatenarla a la id para tener todas las ID diferentes ("artic1","artic2","artic3"...).
Crea una classe o etiqueta que solo usarán los productos
En lugar de usar un div, puedes inventarte una etiqueta y llamarla por ejemplo "producto" o ponerles una clase que no tendrán los demás.
Entonces, en lugar de usar getElementById() usa getElementsByTagName() o getElementsByClass(). Estos te devolverán una array con todos los elementos que usen esa etiqueta o clase ordenados por orden de escritura.
Usar una lista en lugar de divs y ponerle una ID
Esta es la que más te recomiendo, y probablemente la más correcta, pero te la dejo como última opción porque no estoy seguro de cuánto dominas de CSS y si aún no tienes suficiente práctica podría ser un infierno.
Agrupa todos los elementos en un "ul" al que le pondrás una id, y usa "li" en lugar de "div". No tiene porqué ser así pero el navegador lo comprenderá mejor de esta forma. Entonces importaremos los elementos en una array como el ejemplo anterior, pero en este caso escribiremos esta otra línea:
document.getElementById("id_del_ul").querrySelectorAll("li");
En la primera opción donde dice "Ojo" había escrito "foreach" (lo siento, el corrector del móvil XD)
