CODEWITHSUNDEEP
ruby-on-railsrubytwitter-bootstrapsimple-form
Bruno Campos
Bruno Campos

Reputation: 2188

HTML code inside buttons with simple_form

I'm new to rails, and just found the simple_form gem. I installed it with bootstrap suport, but now I can't get this code to work the way I want it

<%= f.button :submit, "<i class='icon-ok icon-white'></i> Save", class: "btn btn-primary" %>

I just want to put the icon inside the button, but when I do this, it shows me a button with the text '<i class='icon-ok icon-white'></i> Save'

I also tried to do

<%= f.button :submit, class: "btn btn-primary" do %><i class="icon-ok icon-white"></i> Save<% end %>

But with no success. How can I add some HTML inside the button with simple_form gem?

Upvotes: 36

Views: 25291

Answers (5)

jasonleonhard
jasonleonhard

Reputation: 13887

One line example submit button in Rails with bootstrap btn class:

<%= button_tag(type: 'submit', class: "btn btn-primary") do %> Save <% end %>

Upvotes: 1

stephenmurdoch
stephenmurdoch

Reputation: 34613

You can do this with the following code:

= f.button :button, 'Send', data: { disable_with: "<i class='fi-heart'></i> Sending..." }

Note that you want to use f.button instead of f.submit Also note that :button needs to be the first param to f.button

Upvotes: 0

Ismael
Ismael

Reputation: 16730

I think you can't do it with simple_form. But I have good news for you. You should be fine using rails helper along side with simple form.

just do

button_tag(type: 'submit', class: "btn btn-primary") do
  content_tag(:i, class: "icon-ok icon-white")
  "Save"
end

Not sure if this works, even the syntax but it should give you a hint

Upvotes: 7

Bombazook
Bombazook

Reputation: 495

In simple_form 3.0rc use :button button type (it passes your block to original ActiveView button helper):

<%= f.button :button do %>
  <i class="icon-save"></i>
  Commit
<% end %>

Or write additional button wrapper.

For additional info look into simple_form/form_builder.rb FormBuilder#button method.

Upvotes: 27

Undistraction
Undistraction

Reputation: 43371

Don't use content_tag. The following works:

  <%= button_tag(type: 'submit', class: "btn btn-primary") do %>
    <i class="icon-ok icon-white"></i> Save
  <% end %>

Upvotes: 71

Related Questions