字体真棒，提交按钮上有simple_form_for

Question

我的目标是使用simple_form_for在提交按钮内添加一个Fontawesome图标

最终目标

现在的形式是这样的：

<%= simple_form_for @model, html: {class: "d-flex align-items-end"} do |f| %>
<%= f.input :model, :as => :hidden, :input_html => { :value => model.id } %>
<%= f.input :x, label: false, :input_html => { :value => model.x_attr } %>
<%= f.button :submit, "x", class: "btn btn-secondary" %>
<% end %>

形式是：

当前表单

是否可以添加<i class="fas fa-cart-arrow-down"></i>在那个带有simple_form的按钮内？

Answer 1

我能找到的唯一方法是在纯HTML上创建提交按钮

<%= simple_form_for @model, html: {class: "d-flex align-items-end"} do |f| %>
<%= f.input :model :as => :hidden, :input_html => { :value => model.id } %>
<%= f.input :quantity, label: false, :input_html => { :value => model.x},  wrap_with: { tag: :span} %>
<label>m</label>
<button type="submit" class="btn btn-success btn-card-index-cart" title="Adicionar ao Carrinho">
<i class="fas fa-cart-arrow-down"></i>
</button>
<% end %>

它按预期工作:)

Answer 2

您可以将块传递到按钮中：

<%= f.button :submit, class: "btn btn-secondary" do %>
<i class="fas fa-cart-arrow-down"></i>
<% end %>

这允许您在按钮中放置任何 HTML。

因此，完整表单如下所示：

<%= simple_form_for @model, html: {class: "d-flex align-items-end"} do |f| %>
<%= f.input :model, :as => :hidden, :input_html => { :value => model.id } %>
<%= f.input :x, label: false, :input_html => { :value => model.x_attr } %>
<%= f.button :submit, class: "btn btn-secondary" do %>
<i class="fas fa-cart-arrow-down"></i>
<% end %>
<% end %>