Create toggle-able Bootstrap tabs from Ruby hash - ruby-on-rails

Question

So I'm trying to create toggle-able tabs from a Ruby hash. For example, let's say that I have the following hash:
tabs = {
:Friends =>
[
[name: 'john', age: 20, sex: 'M'],
[name: 'elma', age: 21, sex: 'F']
],
:Family =>
[
[name: 'father', age: 50, sex: 'M'],
[name: 'mother', age: 48, sex: 'F'],
[name: 'sister', age: 17, sex: 'F']
]
}
This would result in the two tabs 'Friends' and 'Family' respectively which would list either friends or family members as an unordered list.
I would like to make this tabs toggle-able without Ajax if possible, so basically if I click the Friends tab it would access the appropriate value from the tabs[:Friends] hash.
Thanks!

Answer 1

Try this if it help you
Link to ur partial
<div id="toggle_div" style="display:none">
<%= render partial => "ur_partial" %>
</div>
By using JQuery
<script type="text/javascript">
$(function(){
$('.toggleLink').click(function(){
$('#toggle_div').toggle();
});
});
</script>
add different IDs to both tabs and toggle them...

Answer 2

Found the solution yesterday:
<div class="tabbable tabs-left">
<ul class="nav nav-tabs">
<li>
All
</li>
<% tabs.each do |k,v| %>
<li>
<a href="#<%= k.to_s %>" data-toggle="tab">
<%= k.to_s %>
</a>
</li>
<% end %>
</ul>
<div class="tab-content">
<div class = "tab-pane active" id = "all_tabs">
<ul>
<% tabs.each do |k,v| %>
<li>
<%=k%>
</li>
<% end %>
</ul>
</div>
<% tabs.each do |k,v| %>
<div class = "tab-pane" id = "<%= k.to_s %>">
<strong><%= k.to_s %></strong>
<ul>
<% v.each do |key,val| %>
<li>
<%=val.name%>
</li>
<% end %>
</ul>
</div>
<% end %>
</div>
</div>
Here is the generated html output:
http://www.bootply.com/0sWdURMEPY