Wiele formularzy czy wiele przesłań na stronie?

Question

Wiele formularzy czy wiele przesłań na stronie?

Tworzę stronę z produktami sprzedawanymi w serwisie. Chciałbym umieścić przycisk "Dodaj do koszyka" przy każdym produkcie, który jest wymieniony ze znacznikami podobnymi do tego:

<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>
 ...

Ponieważ zgłoszenia będą miały różne nazwy (z dołączonym kodem produktu), pytanie brzmi: Czy powinienem zawinąć całą listę produktów w formularzu, czy utworzyć jeden formularz dla każdego produktu? W kodzie:

<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>

Lub ...

<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>

Która z nich jest najlepszą praktyką? Dowolne poważny powód, aby nie używać jednego lub drugiego, czy robię to całkowicie źle?

62

html forms submit multiple-forms

Author: winck, 2012-01-03

Source

1 answers

score 105 · Accepted Answer

Najlepsza praktyka: jedna forma na produkt to zdecydowanie najlepsza droga.

Korzyści:

zmniejszy rozmiar publikowanych danych

W twojej konkretnej sytuacji

Jeśli kiedykolwiek zamierzasz mieć tylko jeden element formularza, w tym przypadku przycisk submit, jeden formularz dla wszystkich powinien działać dobrze.

My zalecenie Wykonaj jeden formularz na produkt i zmień znaczniki na coś w stylu:

<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>

To daje dużo czystsze i użyteczne POST. Żadnego parsowania. i pozwoli Ci w przyszłości dodać więcej parametrów (rozmiar, kolor, ilość itp.).

Uwaga: nie ma technicznej korzyści z używania <button> vs. <input>, ale jako programista uważam, że praca z action=='add_to_cart' jest fajniejsza niż action=='Add to Cart'. Poza tym nienawidzę mieszać Prezentacji z logiką. Jeśli pewnego dnia zdecyduj, że bardziej sensowne jest, aby przycisk powiedział "Dodaj" lub jeśli chcesz używać różnych języków, możesz to zrobić swobodnie bez martwienia się o kod zaplecza.