如何使用带有 rails 表单助手的图标创建此 HTML5 按钮? [英] How do I create this HTML5 button with an icon with rails form helper?

问题描述

这是我想要的输出:

<button type="submit" class="btn btn-large btn-search btn-primary">
  <i class="icon icon-search"></i> Find Your Apartment
</button>

如果我为链接而不是按钮执行此操作，我可能会执行以下操作:

If I were doing this for a link, instead of a button, I would probably do something like this:

<%= link_to root_path do %>
  <i class="icon icon-search"></i> Find Your Apartment
<% end %>

但鉴于我使用的是 Rails 表单助手，我不太确定如何使用 f.submit 来做到这一点.

But given that I am using Rails form helpers, I am not quite sure how to do this with a f.submit.

我试过了:

<%= f.submit, :class => "btn btn-large btn-search btn-primary" do %>
  <i class="icon icon-search"></i> Find Your Apartment
<% end %>

这给了我一个语法错误.

That gave me a syntax error.

想法?

编辑 1:

就其价值而言，这不会给我语法错误，但不会呈现图标或查找您的公寓"文本:

For what it's worth, this doesn't give me the syntax error but it doesn't render the icon or the "Find Your Apartment" text:

<%= f.submit "Find Your Apartment", :class => "btn btn-large btn-search btn-primary" do %>
  <i class="icon icon-search"></i> Find Your Apartment
<% end %>

推荐答案

可以使用按钮标签

<%= button_tag(type: 'submit', class: "btn btn-large btn-search btn-primary") do %>
 <i class="icon icon-search"></i> Find Your Apartment
<% end %>

这篇关于如何使用带有 rails 表单助手的图标创建此 HTML5 按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！