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 Build a Simple Ruby on Rails Application Designing URLs Refactoring the Flash Code

Brandon Hay
Brandon Hay
1,109 Points

Can't get the flash messages loop to display different alert classes.

Copied the tutorial exactly but my new helper method doesn't seem to be making the change to the classes in order to display the different colored alerts.

Loop code in application.html.erb:

<div class="container">
      <% flash.each do |type, message| %>
        <div class="alert <%= flash_class type %>">
          <button class="close" data-dismiss="alert">x</button>
          <%= message %>
        </div>
      <% end %>

      <%= yield %>
    </div>

and this is my application_helper.rb:

module ApplicationHelper

    def flash_class (type)
        case type
        when :alert
          "alert-error"
        when :notice
          "alert-success"
        else
          ""

        end
    end
end

Regardless of the type of alert it uses the div class="alert" color, but the messages display properly and everything else is fine. Can anyone see where I am going wrong?

5 Answers

Kenan Memis
Kenan Memis
47,314 Points

Hi,

A better approach could be replacing symbols with strings in your helper.

def flash_class (type)
    case type
    when 'alert'
        "alert-error"
    when 'notice'
        "alert-success"
    else
        ""
    end
end

and the html part could be changed as:

<% flash.each do |type, message| %>
    <div class="alert <%= flash_class(type.to_s) %>">
        <button class="close" data-dismiss="alert">x</button>
        <%= message %>
    </div>
<% end %>

this worked

You may want to try just printing the alert type out and use that as your selector.

  <div class="message <%= type %>>

You'd need to change the bass class from "alert" to something else for this to work however. I often go with just "message" then you end up with .message.alert and .message.notice. Doing it this way removes the need or a helper method as well which is always a plus in my book.

Kenan's answer works correctly, but you can also just call the to_s function on the "type" value in the case that way only that one file has to be modified.

Brandon Hay
Brandon Hay
1,109 Points

So by doing this you would have to go into the bootstrap css file and change the class name from alert alert-success to .message.alert? Wouldn't that hurt you in the long run if you wanted to add more bootstrap classes into this loop?

Brandon Barrette
Brandon Barrette
20,485 Points

You can override bootstrap classes by putting them into a CSS file and making sure they load after bootstrap loads. Think of bootstrap as a foundation that you build on.

Brandon Hay
Brandon Hay
1,109 Points

Thanks dude! That worked