Created
October 5, 2011 20:18
-
-
Save mrandyclark/1265564 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# this is pseudo code, so you'll probably need to fix it. | |
def index | |
#@tabs = []; | |
#@articles.each do |article| | |
# @tags << article.tags | |
#end | |
@tabs = [ | |
new Tag(id => 1, name => "andy"), | |
new Tag(id => 2, name => "benson"), | |
new Tag(id => 3, name => "abby") | |
]; | |
# i think you need to do a "unique" on @tabs now. this might be useful: | |
# http://stackoverflow.com/questions/181091/how-do-i-get-the-unique-elements-from-an-array-of-hashes-in-ruby | |
@tabs = @tabs.uniq | |
# true unique needs to compare the objects, i think: | |
# @tabs.inject([]) { |result,h| result << h unless result.include?(h); result } | |
end | |
def getTabContent | |
@tagId = params[:tabId]; | |
@tag = Tag.find_by_id(@tagId); | |
return "html of your tag contnet"; | |
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// you'll need to make sure jquery is included on this file. | |
<div id="tag_navigation"> | |
<% @tabs.each do |tab| %> | |
<div class="tab" _tagId="<%= tab.id %>"> | |
<%= tab.name %> | |
</div> | |
<% end %> | |
</div> | |
<div id="tag_content"> | |
</div> | |
<script> | |
$(document).ready(function() { | |
$("#tag_navigation .tab").click(function() { | |
console.log("tag id: " + $(this).attr("_tagId")); | |
// http://api.jquery.com/category/ajax/ | |
$.ajax({ | |
url: "/getTabContent", | |
type: 'POST', | |
data: { tagId: $(this).attr("_tagId") }, | |
success: function(response){ | |
$("#tag_content").html(response); | |
} | |
}); | |
}); | |
}); | |
</script> | |
<style> | |
#tag_navigation { clear: both; float: left; } | |
#tag_navigation .tab {background-color: #444; color: #ccc; cursor: pointer; float: left; margin: 0px 3px; padding: 10px; } | |
</style> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment