CODEWITHSUNDEEP
htmlruby-on-railsform-helpers
alopez02
alopez02

Reputation: 1524

Producing a button element instead an input element with Rails form helpers

I'm using a front-end template, in my Rails application, that styles buttons with CSS by selecting them from the tag.

The problem is that Rails Form Helpers render buttons by producing HTML code with tags instead of tags. Therefore when executing the following html.erb code:

<%= simple_form_for @waiter do |f| %>
    <%= f.input_field :email %>
    <%= f.button :submit, "My button" %>
<% end %>

It renders the button as:

<input type="submit" name="commit" value="My button" class="btn btn-default" data-disable-with="My button">

And I'd like to produce an HTML code, for the button, that resembles:

<button relevant_attributes="relevant values">My button</button>

I've tried so far without success:

  1. Adding a CSS id to the input tag and modifying the template stylesheets to reproduce the button styles (I've realized this won't be an effective option for reasons difficult to explain here).
  2. Using vanilla Rails Form Helpers instead of the simple_form ones (renders input tag elements as well).

The only solution so far has been to create directly an HTML button element (as below) and binding it to an onClick JS event that triggers an Ajax request that submits the form via JS:

<%= simple_form_for @waiter do |f| %>
    <%= f.input_field :email %>
    <button id="my-button">My button</button>
<% end %>

The present solution doesn't seem to be very elegant. Could anyone advice on a better solution? Is it possible to produce button elements through Rails helpers?

Upvotes: 0

Views: 1777

Answers (1)

kolas
kolas

Reputation: 754

You can use button_tag

It should be type="submit" to submit the form by default

Upvotes: 1

Related Questions