link - html title attribute

¿Múltiples formas o múltiples envíos en una página?

Question

Estoy creando una página con los productos vendidos en el sitio web. Me gustaría incluir un botón "agregar al carrito" cerca de cada producto, que se enumeran con un marcado similar a este:

<h4 class="productHeading">Product Name 1</h4>
<div>
Extra information on the product 1.
</div>
<h4 class="productHeading">Product Name 2</h4>
<div>
Extra information on the product 2.
</div>
...

Dado que las entradas de envío tendrán diferentes nombres (con el código del producto incluido), la gran pregunta es: ¿debo incluir toda la lista de productos en un formulario, o debo crear un formulario para cada producto? En codigo:

<form method="post" action="process.php">
<h4 class="productHeading">Product Name 1</h4>
<div>
Extra information on the product 1.
<input type="submit" name="submit1" value="Add to Cart">
</div>
<h4 class="productHeading">Product Name 2</h4>
<div>
Extra information on the product 2.
<input type="submit" name="submit2" value="Add to Cart">
</div>
</form>

O…

<h4 class="productHeading">Product Name 1</h4>
<div>
Extra information on the product 1.
<form method="post" action="process.php">
<input type="submit" name="submit1" value="Add to Cart">
</form>
</div>
<h4 class="productHeading">Product Name 2</h4>
<div>
Extra information on the product 2.
<form method="post" action="process.php">
<input type="submit" name="submit2" value="Add to Cart">
</form>
</div>

¿Cuál es la mejor práctica? ¿Alguna razón seria para no usar una u otra, o lo estoy haciendo completamente mal?

Answer 1

Mejor práctica: una forma por producto es definitivamente el camino a seguir.

Beneficios:

• Le ahorrará la molestia de tener que analizar los datos para descubrir en qué producto se hizo clic
• Reducirá el tamaño de los datos publicados

En tu situación específica

Si solo tiene la intención de tener un elemento de formulario, en este caso un botón de submit , un formulario para todos debería funcionar bien.

Mi recomendación Haga una forma por producto y cambie su marcado a algo como:

<form method="post" action="">
<input type="hidden" name="product_id" value="123">
<button type="submit" name="action" value="add_to_cart">Add to Cart</button>
</form>

Esto le dará un POST mucho más limpio y utilizable. Sin análisis. Y le permitirá agregar más parámetros en el futuro (tamaño, color, cantidad, etc.).

Nota: No hay beneficio técnico para usar <button> vs. <input> , pero como programador me resulta más frío trabajar con action==''add_to_cart'' que action==''Add to Cart'' . Además, odio mezclar presentación con lógica. Si un día decide que tiene más sentido que el botón diga "Agregar" o si desea utilizar diferentes idiomas, puede hacerlo libremente sin tener que preocuparse por su código de fondo.