表格内部的表单

Question

我在HTML表格中包含了一些表单，用于添加新行和更新当前行。我遇到的问题是，当我在开发工具中检查表单时，我发现表单元素在打开后立即关闭（输入框等不包含在表单内）。

因此，提交表单时无法包含字段。

表格行和输入框如下：

<tr>
    <form method="post" action="">
        <td>
            <input type="text" name="job_num">
        </td>

        <td>
            <input type="text" name="desc">
        </td>
    </form>
</tr>

任何帮助将会很棒，谢谢。

Answer 1

如果您想保存您的标记，请使用"form"属性：

<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>标签之外的表单字段)

Answer 2

一个表单不允许作为table、tbody或tr的子元素。试图将表单放在这些位置会导致浏览器将表单移到表格之后（同时保留其内容 - 表格行、表格单元格、输入框等）。

你可以在一个表单内放置整个表格。你可以在表格单元格内放置一个表单。但你不能在表单内放置表格的一部分。

在整个表格周围使用一个表单。然后可以使用点击的提交按钮来确定要处理的行（以提高速度），或者处理每一行（允许批量更新）。

HTML 5引入了form attribute。这允许你在表格之外为每一行提供一个表单，然后使用其id将给定行中的所有表单控件与其中一个表单关联起来。