使用jQuery将Rails表单加载到表中

这件事已经让我的项目停滞了几天。
我有一个标准的价值表；有这样的骨架：

<table><tbody><tr><td>Stuff!</td></tr></tbody></table>

<tr>
  <td>
    <%= form_for @model, :remote => true do |f| %>
  </td>
  <td>
    <%= f.text_field :column %>
  </td>
  <td>
    <%= f.submit "Add" %>
    <% end %>
  </td>
</tr>

<table>
  <tbody>
    <tr>
      <td>
        <form>
        </form>
      </td>
      <td>
        <input>
      </td>
      <td>
        <input type="submit">
      <td>
    </tr>
    <tr>The list of values</tr>
  </tbody>
</table>

这里是混乱开始的地方：在Webkit浏览器和IE中，这就像预期的那样工作！生成的HTML如下所示：

<table><tbody><tr><td>Stuff!</td></tr></tbody></table>

<tr>
  <td>
    <%= form_for @model, :remote => true do |f| %>
  </td>
  <td>
    <%= f.text_field :column %>
  </td>
  <td>
    <%= f.submit "Add" %>
    <% end %>
  </td>
</tr>

<table>
  <tbody>
    <tr>
      <td>
        <form>
        </form>
      </td>
      <td>
        <input>
      </td>
      <td>
        <input type="submit">
      <td>
    </tr>
    <tr>The list of values</tr>
  </tbody>
</table>

值列表

当然，在输入开始之前，表单在同一个单元格中开始和结束，这一事实应该会发出一个红色信号，表明出现了问题。但是，表单仍然提交，并且在其他情况下可以完美地工作

在Firefox中，情况并非如此。表单呈现更像这样的内容（显示的只是前置行中的内容，因为其他内容都是相同的）：

这里的区别在于，与Webkit/IE浏览器不同，Firefox将所有内容都放入

表单

标记的单元格中。而且，表单根本不起作用-它甚至不提交。甚至没有发出任何请求

现在，从我的一些研究中，我了解到我在这里可能犯了一个巨大的错误，不同之处在于浏览器试图以不同的方式呈现我遗漏的内容。通过对它的研究，我发现这与Rails表单如何与表交互没有多大关系——如果只是在表中呈现部分，浏览器之间的HTML是相同的（但是，表单标记仍然在其他输入开始之前关闭，这可能意味着我放错了位置！）。当我使用jQuery预处理呈现的部分时，出现了一些错误：可能由于没有封闭表标记，部分呈现错误，然后被插入到表中，从而导致了问题

真的，我被难住了。我已经广泛地寻找了这个问题，虽然有一些与此相关的问题，但似乎没有一个真正触及我的问题

我希望我犯了一些非常简单的错误——但这是什么呢

---

任何帮助都将不胜感激！我希望我已经尽可能清楚地解释了这个问题。

通过查看部分，这是非常明显的。您有一个嵌套错误。如果在某个元素（在本例中为表单元格）内打开表单标记，则也需要在该元素处将其关闭。在这种情况下，验证标记会有所帮助

---

如果您必须使用表格，您可以在其周围放置表单标签，并将完整内容插入页面。

谢谢。问题是，如果每个输入都有一个单元格，这样它就可以与相应的表头单元格对齐，那就更好了。你认为这是可能的吗？为表单设置一个单独的表，并使列宽与其他列宽匹配。如果不想固定宽度，可以添加相同的标题并隐藏它们。我可能会以不同的方式组织ui，并使用css设计表单样式，而不是与表格混淆。