Form inside a table
Use the "form" attribute, if you want to save your markup:
<form method="GET" id="my_form"></form>
<table>
<tr>
<td>
<input type="text" name="company" form="my_form" />
<button type="button" form="my_form">ok</button>
</td>
</tr>
</table>
(*Form fields outside of the < form > tag)
A form is not allowed to be a child element of a table
, tbody
or tr
. Attempting to put one there will tend to cause the browser to move the form to it appears after the table (while leaving its contents — table rows, table cells, inputs, etc — behind).
You can have an entire table inside a form. You can have a form inside a table cell. You cannot have part of a table inside a form.
Use one form around the entire table. Then either use the clicked submit button to determine which row to process (to be quick) or process every row (allowing bulk updates).
HTML 5 introduces the form
attribute. This allows you to provide one form per row outside the table and then associate all the form control in a given row with one of those forms using its id
.