将带有提交标签的输入包装在一个 div 中答案

【问题标题】：Wrap input with submit tag in one div将带有提交标签的输入包装在一个 div 中
【发布时间】：2014-08-11 15:39:38
【问题描述】：

假设我有这些由 simple_form_for 生成的字段：

= f.input :amount, label: false, required: true
= f.submit "✓", class: "btn btn-primary"

我想将它们包装在一个 div 中，并且它们都不应该嵌套在任何其他 div 中。

（应该是这样的）：

<form>
  <div class="inputFields">
     <input name="amount"> <!-- f.input -->
     <input name="commit"> <!-- f.submit -->
  </div>
</form>

现在看起来像这样：

<form>
  <div class="fieldcontainer">
     <input name="amount"> <!-- f.input -->
  </div>
  <input name="commit"> <!-- f.submit -->
</form>

如何做到这一点？

【问题讨论】：

如果您想自定义表单中的 html 元素，那么您为什么要使用 simple_form？使用 rails form_for 助手，然后按照您希望的方式对其进行自定义
@Mandeep simple_form 在 html 包装器之外添加了相当多的功能。因此，想要该功能和不同的结果 html 包装器是完全有效的。

【解决方案1】：

根据Simple Form documentation，您可以通过使用input_field 而不是input 来跳过使用包装器html 标签。因此，如果这只是一次性案例，那么您可以定义自己的包装器 div 标签并关闭自动生成的包装器：

.inputFields
  = f.input_field :amount, label: false, required: true
  = f.submit "✓", class: "btn btn-primary"

或者，如果这不是一次性案例并且是常见的事情，您可以创建自己的包装器...请参阅 custom wrapper documentation 寻求帮助。

【讨论】：