How to resolve the following HTML error?

Question

I have the following lines in my django template file:-cart.html:-

<td class="right">
    <form method="post" action="." class="cart">
        <label for="quantity">Quantity:</label>
        <input type="text" name="quantity" value="{{ item.quantity }}" id="quantity" size="2" class="quantity" maxlength="5" />
        <input type="hidden" name="item_id" value="{{ item.id }}" />
</td>
<td>
    <input type="submit" name="submit" value="Update" />
    </form>
</td>

At the first closing tag of td i.e is the first </td>,i get the following error: Element form is not closed.Please help me to rectify this error.

Dante · Accepted Answer · 2015-04-25T18:34:53.873

HTML tags must be structured in a directly hierarchic manner. Closing a tag that was opened inside previously closed elements is incorrect and will often produce errors and issues.

Enclose the form inside the table data, like this:

<td class="right">
    <form method="post" action="." class="cart">
        <label for="quantity">Quantity:</label>
        <input type="text" name="quantity" value="{{ item.quantity }}" id="quantity" size="2" class="quantity" maxlength="5" />
        <input type="hidden" name="item_id" value="{{ item.id }}" />
        <input type="submit" name="submit" value="Update" />
    </form>
</td>

or enclose either the whole table or the table elements inside the form, like this:

<form method="post" action="." class="cart">
    <td class="right">
        <label for="quantity">Quantity:</label>
        <input type="text" name="quantity" value="{{ item.quantity }}" id="quantity" size="2" class="quantity" maxlength="5" />
        <input type="hidden" name="item_id" value="{{ item.id }}" />
    </td>
    <td>
        <input type="submit" name="submit" value="Update" />
    </td>
</form>

I assume the latter solution is the one you're looking for.

score 1 · Answer 2 · answered Apr 25 '15 at 18:12

Well, try tabbing the first line so that it is lined up with its closing tag.

Then I'd fiddle with the code for bit and try out things. Here's a good article to look at: http://help.simplytestable.com/errors/html-validation/end-tag-for-element-x-which-is-not-open/end-tag-for-element-form-which-is-not-open/

score 1 · Answer 3 · edited May 23 '17 at 12:21

If you are trying to put the form across multiple tds, that will be difficult with your current approach.

Unfortunately, you can't have the form inside a table row, and your current HTML is invalid since the td element is closed before the form element.

You either need to:

have the whole table in the form
Have the whole form in a table cell.
Use the html5 form attribute

See Form inside a table

How to resolve the following HTML error?

3 Answers3