0

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?

1 Answer 1

1

You can use button_tag

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

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.