在一个div中使用submit标签包装输入

Question

我们说我有这些字段由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>

如何实现这一目标？

Answer 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寻求帮助。