Add form to table rows

PeeHaa picture PeeHaa · Jul 15, 2011 · Viewed 9.1k times · Source

Which is a valid way (if any) to add a form to table rows?

I have the following situation:

<table>
  <tr>
    <td><input type="text" name="q"></td>
    <td><input type="text" name="a"></td>
    <td><input type="submit" name="submit" value="Submit"></td>
  </tr>
  <tr>
    <td><input type="text" name="q"></td>
    <td><input type="text" name="a"></td>
    <td><input type="submit" name="submit" value="Submit"></td>
  </tr>
  <tr>
    <td><input type="text" name="q"></td>
    <td><input type="text" name="a"></td>
    <td><input type="submit" name="submit" value="Submit"></td>
  </tr>
</table>

How can I add a form element and still have valid HTML?

<table>
  <form>
    <tr>
      <td><input type="text" name="q"></td>
      <td><input type="text" name="a"></td>
      <td><input type="submit" name="submit" value="Submit"></td>
    </tr>
  </form>
</table>

Is invalid (at least I think it is)

Answer

Mario Uher picture Mario Uher · Jul 15, 2011

Wrap your table inside the form element:

<form action="/" name="form1">
  <table>...</table>
</form>

But even better: Build your form without tables if possible.