In this conclusion to an eighteen-part series on the Action Pack library for Rails, we'll take the application we've built in previous parts and give it some style. This article is excerpted from chapter six of the book Beginning Rails: From Novice to Professional, written by Jeffery Allan Hardy, Cloves Carneiro Jr. and Hampton Catlin (Apress; ISBN: 1590596862).
Adding Style with Action Pack - Highlighting the Selected Tab (Page 2 of 2 )
We want to apply a CSS class to the navigation links to indicate to the user that the link is selected. To accomplish this, we’ll make (you guessed it) a new helper method that wraps link_to and adds some functionality, as shown in Listing 6-34. Add this method to the application helper in app/helpers/application_helper.rb .
Listing 6-34. Helper Addition to app/helpers/application_helper.rb
link_to name, url_options, html_options.merge(:class => css_class) end
This method works by applying the CSS class selected to the link if the given block returns true . We use it just as we would a regular link_to helper, except that we pass it a block. Inside the block, we need to do a little work to figure out whether the link should be selected. To do this, we interrogate the current environment a bit to determine whether we’re showing events or adding a new event.
To see this at work, we need to update the application layout in app/views/layouts/ application.rhtml and use link_to_with_selected in place of link_to for our tabbed navi gation. The relevant code is shown in Listing 6-35.
Listing 6-35. Updated Navigation List in app/views/layouts/application.rhtml
> <%= link_to_with_selected('Events', events_url) do
params[:controller] == 'events' && params[:action] != 'new' end %>
<% if logged_in? %>
<li> <%= link_to_with_selected('New Event', new_event_url) do params[:controller] == 'events' && params[:action] == 'new' end %> </li>
<% end %> </ul>
Now when we’re in the events controller and not on the new action ( params[:action] != 'new' ) or when we’re on the new action ( params[:action] == 'new' ), the block yields true , and the correct tab is selected. Perfect!
With the CSS in place and with this helper to improve navigation, our application is really starting to look nice. If you’ve done everything correctly, yours should look a lot like Figure 6-5.
This chapter covered a lot of ground. Truth be told, we probably could have made this into two or even three chapters. But as you know by now, Action Pack is a tightly inte grated component of Rails, and it would have been difficult to separate the concepts while retaining continuity.
We started this chapter with a general introduction to the components that compose Action Pack, the Rails library responsible for the controller and the view. Then we launched into a controller walk-through, where we built a complete controller from scratch, eliminating our scaffolding dependency. In doing so, you learned about routes, how to generate a controller, how actions relate to views, how to create templates, and how to work with layouts. We introduced Rails’ form helpers, and you learned how to easily create forms that integrate with Active Record objects. We also introduced partials, and you learned how to leverage them to keep your templates DRY and easy to maintain.
We discussed a fair number of advanced topics in this chapter as well, including sessions and state, the philosophy of the shared-nothing architecture, and how to protect actions using filters. But we didn’t stop there. You also learned how to sanitize HTML to protect your application from defacement from malicious users, and how to create your own helpers to improve your interface. We even took the time to make our application look pretty, sprucing up the layout and adding some CSS.
This chapter gave you your first taste of Rails outside the model. You now have a complete understanding of how Rails divides its concerns and a first-hand look at MVC in action. We started by modeling our domain in Chapters 4 and 5, and now we’ve completed the first iteration of building a web application around our domain.
We’ve said it before, but we’ll say it again: you should be proud of yourself. At this stage, you know a lot about Rails. The next chapters will build on this knowledge, starting with techniques to improve user interaction by way of a technology known as Ajax.
DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.