Html multiple-item shopping list; form element with input type submit returns back only the last for-CodePudding

Im working on a shopping list with multiple items, each has a search bar and submit button using the form element but only the last item appears no matter which item I click the submit search on. Any ideas? Here's my code. Thanks a bunch.

 <body>
 <!-- create your shopping list here! -->
 <form method="GET" action="https://www.amazon.com/s" target="_blank">
 <input name="k" value="Black Magic Pocket 6k pro"/>
 <input type="submit"/>
 <br/>
 <form method="GET" action="https://www.amazon.com/s" target="_blank">
 <input name="k" value="Les Paul Modern"/>
 <input type="submit"/>
 <br/>
 <form method="GET" action="https://www.amazon.com/s" target="_blank">
 <input name="k" value="Aputure Amaran 200d"/>
 <input type="submit"/>
 <br/>
 <form method="GET" action="https://www.amazon.com/s" target="_blank">
 <input name="k" value="Numchucks"/>
 <input type="submit"/>
 </form>
 </body>
 </html>

CodePudding user response：

You have to close the form element every time you open it, that's how I fixed it. Also, when that's done, the line breaks will be unnecessary.

Example:

<html>
  <head>
    <title>My Shopping List</title>
  </head>
  <body>
    <form action="https://www.amazon.com/s" method="GET" target="_blank">
    <input name="k" value="lasagna"><input type="submit">
    </form>
    <form action="https://www.amazon.com/s" method="GET" target="_blank">
    <input name="k" value="Dr Pepper"><input type="submit">
    </form>
    <form action="https://www.amazon.com/s" method="GET" target="_blank">
    <input name="k" value="Ben and Jerry's"><input type="submit">
    </form>
  </body>
</html>