Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

class: 'form-horizontal does not work in simple_from in Ruby tutorial -> Create dropdown list

I installed simple_form 3.0 and boostrap 3.0 in Rails 4.0, (ruby 1.9.3). When I set form to form-horizontal, I still get the vertical version of the form: label and input field in a different line, (I have checked everything and all my codes and installation is correct), Only guess is that simple_form does not work well with boostrap 3.0. Question here: what is workaround? I want form label and input area are in the line, below is my code:

in <%= f.input :user_id, collection: User.all, label_method: :full_name%>, it generates two line, one line for label: name, then second line is user drop down list

<%= simple_form_for(@status, html: {class: 'form-horizontal'}) do |f| %>
  <% if @status.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@status.errors.count, "error") %> prohibited this status from being saved:</h2>

     <ul> <% @status.errors.full_messages.each do |msg| %> <li><%= msg %></li> <% end %> </ul> </div> <% end %>      <%= f.input :user_id, collection: User.all, label_method: :full_name%> <%= f.input :content %>           <div class="form-actions"> <%= f.button :submit%> </div> <% end %>

I'm having the same problem.

Treehouse really needs to update or make note of these types of changes.

I got it to work! You must have latest version of simple_form - 3.0 for it to work. See here: http://stackoverflow.com/questions/9311120/twitter-bootstrap-simple-form-not-making-horizontal-form-or-correct-html-output

Make sure to replace your gem simple_form with correct version (3.0), then do bundle update, bundle install, and it will work.

I'm having the same problem, and still can't get it to work. I tried to follow the instructions you mentioned:

  1. In Gemfile, changed... gem 'simple_form' ...to... gem 'simple_form', '~> 3.0.0.rc'

  2. I typed the bundle update command in Terminal

  3. I typed the bundle install command in Terminal

Then I turned on the rails server, refreshed my http://localhost:3000/statuses/new page, and I'm still seeing the vertical form instead of the horizontal one. Am I missing something?

Here's the code I have at the top of _form.html.erb, as shown in the video:

<%= simple_form_for(@status, html: {class: "form-horizontal"}) do |f| %>

When you installed simple_form, did you make sure to install it with bootstrap?

rails generate simple_form:install --bootstrap

Yes, I used that exact command.

Ok, I figured it out. I had rails 3.2.12 installed instead of 3.2.6 (as shown in the video). Once I updated to 3.2.6, simple_form started working.

For anyone else having this issue:

  1. Go to the Gemfile in your text editor
  2. Change gem 'rails', '3.2.12' to gem 'rails', '3.2.6' and save the file
  3. Go back to Terminal
  4. Run the command bundle install. You'll get an error.
  5. Run the command bundle update.
  6. Restart the rails server (rails s)

And like magic, you'll now see the properly formatted form after refreshing http://localhost:3000/statuses/new.

One thing I forgot to mention. Update the simple_form gemfile to gem 'simple_form', '~> 2.1.0'. I'm not sure if it will work without the 2.1.0 version designation.

I am using rails 4.0. In the railsinstaller.org, the latest package is rails 4.0.Lots of content in the video does not work in rails 4.0 including simple form, shoulda, strong parameters etc. Looks like I have to downgrade to rails 3.2 to make things work.

Yeah, I'd suggest doing that to avoid the inevitable frustration.

I too installed the railsinstaller and got the rails 4.0 (This is for the Mac OSX version). I fought with this for a while but to get this resolved I did the following:

1) Add to Gemfile

use Simple Form

gem 'simple_form', '3.0.0.rc'

2) Use a 2.0+ < 3.0 version of Bootstrap (I found this easier than fighting to make the new version of bootstrap work)

3) bundle install

4) rails generate simple_form:install --bootstrap (You will probably have to overwrite conflicted versions with the new version you are pulling)

Good to go.

I should also note that to even get to this point I had to require certain versions of other gems:

use Devise for Login Authentication

gem 'devise', '3.0.0rc'

use Deprecated Protected Attributes - attr_accessible

gem 'protected_attributes'

Worked perfectly for me using rails 4.0.0 on ubuntu, version bootstrap 2.3.2, and simple_form 3.0.0.rc.

I had to downgrade from the latest 3.0 bootstrap version and simple_form version. All you have to do to downgrade your bootstrap is replace the files in your app/assets.

After doing that run... rails generate simple_form:install --bootstrap

Thanks!

5 Answers

This is a real headscrew... everything was going so smoothly until this point. Can treehouse provide a definitive list of rails/gems/bootstrap etc that work together??

I think since Bootstrap 3 is new, and Rails 4 is out (although videos are covering Rails 3.2.6) it's hard for Treehouse to be 100% current. I'm actually stuck in this same spot right now with trying to integrate Bootstrap 3 with Rails 3.2 (v3.2.13).

My forms are ok after I made a few edits to my simple_form initializer in config/initializers/simple_form. But I hope soon Treehouse will make an official update on integrating Bootstrap 3 with Simple_Form gem and newest version of Rails.

Let me know if anyone finds a solution for this.

Yeah i'd really like a definitive list of compatible software. I've actually temporarily stopped the course at this point as after reading other comments it seems like further problems are going to arise as a result of differing versions. I don't like the idea of down-grading bootstrap, or other ruby gems etc. Hope this can be resolved in the near future!

I was on Rails V 3.2.13 and Bootstrap 3 and Simple Form 2.1. Went down to Rails 3.2.6. Still no dice. Uninstalled Bootstrap 3 and went to 2.3. That did the trick. Following the version requirements in the Treehouse videos is a lot more important than I originally thought.

I'm using Bootstrap 3.2 and updated Simple Form to 3.1.0.rc2:

gem 'simple_form', '>= 3.1.0.rc2'

And it started to work only after I added some code from Simple Form examples it started to work. Link here

<%= simple_form_for(@status, html: { class: 'form-horizontal' }, wrapper: :horizontal_form) do |f| %>

There is more things to checkout.

Here's the problem with this issue. Rails 3.X.X and Bootstrap 2 was used. Since then Rails 4.0 and Bootstrap 3 have been released. This is what is causing issues because simple_form was not up to speed for a while. As of 7/17/2014 simple_form has dropped support for anything below rails 4.0 and at the same time added support for Bootstrap 3. So what does this mean? Its pretty simple.

If you are below Rails 4.0 you must use Bootstrap 2 if you want to use simple_form. (This is obviously not recommended as the rails devs don't even support anything below rails 4.0) If you are using Rails 4.0 then you need to use simple_form 3.1.0.rc2 (this is the latest beta version that supports Bootstrap 3)

So here is my recommendation.

  1. Update Rails to 4.0 if it isn't already.

  2. Uninstall simple_form by using this command. gem uninstall simple_form

  3. Add this line to your Gemfile. gem 'simple_form', '~> 3.1.0.rc2'

  4. Go to your irb and type in "bundle" (without the quotes)

  5. Now type in "rails generate simple_form:install --bootstrap" (no quotes) in irb. If you had another version in it will probably ask you if you want to override the files 1 by 1. Just hit "y" and "enter" until it installs. This is going to update the default class names from Bootstrap 2 to Bootstrap 3.

You should now be running rails 4 with simple_form 3.1.0.rc2 and have Bootstrap 3 forms.

I had exactly as you described, with Rails 4.1.4, Bootstrap 3.2, Simple Form 3.1.0.rc2. But it still didn't worked, and as I looked for solution, this helped:

<%= simple_form_for(@status, html: { class: 'form-horizontal' }, wrapper: :horizontal_form) do |f| %>

Without "wrapper: :horizontal_form" this part it just don't work for me, and it's not mentioned in documentation, just in example. Weird.

You are right you will need to add that line at the top of your form.