66

ウェブサイトで販売されている商品のページを作成しています。各製品の近くに「カートに追加」ボタンを含めたいと思います。これらのボタンは、次のようなマークアップでリストされています。

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

送信入力の名前は（製品のコードを含めて）異なるため、大きな問題は、製品リスト全体をフォームでラップする必要があるのか​​、それとも製品ごとに1つのフォームを作成するのかということです。コード内：

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

または…</p> 

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

どちらがベストプラクティスですか？どちらか一方を使用しない重大な理由はありますか、それとも私はそれを完全に間違っていますか？

4

1 に答える 1

110

ベストプラクティス：製品ごとに1つのフォームが間違いなく進むべき道です。

利点：

  • これにより、データを解析してクリックされた製品を特定する手間が省けます。
  • 投稿されるデータのサイズを縮小します

あなたの特定の状況で

1つのフォーム要素（この場合はsubmitボタン）だけを使用する場合は、すべての1つのフォームで問題なく機能するはずです。

私の推奨事項 製品ごとに1つのフォームを作成し、マークアップを次のように変更します。

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

これにより、はるかにクリーンで使いやすくなりますPOST。解析はありません。また、将来的にパラメータ（サイズ、色、数量など）を追加できるようになります。

注：<button> vsを使用することに技術的な利点はありませんが、プログラマーとしては、よりも<input>作業する方がクールだと思います。その上、私はプレゼンテーションとロジックを混ぜることが嫌いです。ある日、ボタンに「追加」と表示する方が理にかなっていると判断した場合、または別の言語を使用したい場合は、バックエンドコードを気にすることなく自由に使用できます。action=='add_to_cart'action=='Add to Cart'

于 2012-01-03T13:13:09.487 に答える