将表单行放入表格的最佳方法是什么？答案

【问题标题】：What is the best way to get a form row into a table?将表单行放入表格的最佳方法是什么？
【发布时间】：2016-11-02 22:28:26
【问题描述】：

我正在构建一个显示包含一些信息的表格的应用程序。我希望用户能够单击单元格并在其下方滑出一行，其中包含可以进行操作的表单。

所以它看起来像这样：

<table>
  <tr>
    <td>some info 1</td>
    <td>some info 2</td>
    <td>some info 3</td>
  </tr>
  <tr>
    <form> some form that spans the entire row + submit button </form>
  </tr>
</table

表单将被隐藏，通过单击其中一个单元格，表单将向下滑动。

我面临的问题是无法将表单呈现为表格行。我已经阅读了多个消息来源说它无法完成。我可以在单个单元格中渲染它，但表单太大了。

我读到的一个解决方案是用表单标签包裹整个表格并有多个提交按钮。这对我来说感觉像是不好的做法，我不确定它会起作用。

我也研究过使用 div 重新创建表格，但是我找到的每个解决方案都使用“显示：表格”，这具有完全相同的问题。

处理此问题的最佳方法是什么？（我正在使用 Ruby on Rails）

【问题讨论】：

你的意思是“表格太大了”？您在处理数千个表行吗？
不，我的意思是表格不能整齐地放入 1 个表格单元格中而不跨越多行。所以它起作用了，它看起来很糟糕。我希望它跨越整个行的宽度，而不仅仅是 1 个单元格。

标签： html forms html-table

【解决方案1】：

<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
   <form action="">
     <td colspan="3"><input type="text"></td>
   </form>
  </tr>
</table>

您是否尝试过使用 colspan？

【讨论】：

【解决方案2】：

如果您的项目允许您这样做，我的建议是用 div 替换 table。您可以使用引导程序 (https://getbootstrap.com/examples/grid/) 来简化此操作。为什么： 1. 更简洁的代码 2.您可以比表格原始/单元格更容易地操作 div... 3. 您可以像 tr 一样快速复制 div 。试一试，然后再做决定。

【讨论】：