Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Branch: master
Fetching contributors…

Cannot retrieve contributors at this time

57 lines (36 sloc) 1.94 KB


Dynamic in-page tabbed navigation for Rails, supporting both inline and remote content. LiveTabs also degrade gracefully and allow for bookmarking of open tabs.


In order to copy the required assets to your public folder, first run:

script/generate live_tabs_assets

In your application template, require them as follow:

<%= javascript_include_tag :defaults, 'live_tabs', :cache => true %>
<%= stylesheet_link_tag 'live_tabs', :cache => true %>

In your view:

<% tabset(:tabs, :placeholder => "Loading...", :class => 'my-class') do |t|'Static HTML') do
			<h2>This is a tab containing plain HTML</h2>
	end'Static HTML with custom classes', {}, :style => 'color: red') do 
			<h2>This is a tab containing plain HTML but with some custom HTML attributes</h2>
	end'HTML',  :html => "Some <b>inline</b> HTML content without an ERb block")'Partial',  :partial => 'partial')'File',     :file => File.join(RAILS_ROOT, 'app/views/tabs/file.html.erb'))'Remote content', :url => slow_tabs_path)'Remote content with custom placeholer', :url => slow_tabs_path, :placeholder => "Slow Loading...")
end %>

This will generate a series of <fieldset> elements which are then automatically processed to create a neat tabbed navigation. The helper will generate tab identifiers, e.g. “Remote content” will become “remote_content”. This ID can be used as an URL fragment to open the page and activate the tab, e.g. /path/to/page#remote_content.

You can also set the default active tab in your controller using:

set_tab_focus("Name of your default tab")

You can also programmatically set active tabs from within your views with:

<%= link_to_tab_with_id("open this tab", "remote_content") %>
<%= link_to_tab_with_name("open that tab", "Remote content") %>

Copyright © 2008-2009 Xavier Defrang, released under the MIT license

Jump to Line
Something went wrong with that request. Please try again.