× {{alert.msg}} Never ask again
Get notified about new tutorials RECEIVE NEW TUTORIALS

Ruby on Rails: Super Easy Forms with Bootstrap

Christoph Wagner
Aug 18, 2015
<p>Have you ever found yourself thinking "gee, <a href="http://guides.rubyonrails.org/form_helpers.html">Rails Form Helpers</a> are nice, but the results just look so... meh"? Or "I'm glad <a href="http://getbootstrap.com/">Bootstrap</a> provides all these nice <a href="http://getbootstrap.com/css/#forms">form classes</a>, but incorporating them in my Rails app sure is a lot of work"?</p> <p>Not to worry, the <a href="https://github.com/bootstrap-ruby/rails-bootstrap-forms">bootstrap-forms</a> gem is here to save the day! It's a drop-in replacement for the old <code>form_for</code>, and generates all the boilerplate bootstrap markup for you.</p> <p>In other words, it turns this:</p> <pre><code class="language-html">&lt;%= bootstrap_form_for(@user) do |f| %&gt; &lt;%= f.email_field :email %&gt; &lt;%= f.password_field :password %&gt; &lt;%= f.check_box :remember_me %&gt; &lt;%= f.submit "Log In" %&gt; &lt;% end %&gt;</code></pre> <p>In to this:</p> <pre><code class="language-html">&lt;form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post"&gt; &lt;div class="form-group"&gt; &lt;label for="user_email"&gt;Email&lt;/label&gt; &lt;input class="form-control" id="user_email" name="user[email]" type="email"&gt; &lt;/div&gt; &lt;div class="form-group"&gt; &lt;label for="user_password"&gt;Password&lt;/label&gt; &lt;input class="form-control" id="user_password" name="user[password]" type="password"&gt; &lt;/div&gt; &lt;div class="checkbox"&gt; &lt;label for="user_remember_me"&gt; &lt;input name="user[remember_me]" type="hidden" value="0"&gt; &lt;input id="user_remember_me" name="user[remember_me]" type="checkbox" value="1"&gt; Remember me &lt;/label&gt; &lt;/div&gt; &lt;input class="btn btn-default" name="commit" type="submit" value="Log In"&gt; &lt;/form&gt;</code></pre> <p> Sweet!</p>
comments powered by Disqus