tag:blogger.com,1999:blog-1502761093196431512.post8838594011685453651..comments2024-01-06T14:58:41.477+11:00Comments on Ruby-coloured glasses: Sliding Door Tabs take 2Taryn Easthttp://www.blogger.com/profile/00647732421144825421noreply@blogger.comBlogger4125tag:blogger.com,1999:blog-1502761093196431512.post-86850964193667511252008-03-13T22:54:00.000+11:002008-03-13T22:54:00.000+11:00Update from "anonymous".What I have is a set of na...Update from "anonymous".<BR/><BR/>What I have is a set of navigation tabs and in each of these tabs I typically have a paginated table. Ideally I want both the tabs and the paginated output to be ajax enabled such that clicking on a tab just refreshes the tab content on the screen and clicking on the pagination controls just displays the next page inside the selected tab - a not unreasonable or uncommon pattern (imho).<BR/><BR/>I was using the tabnav plugin (http://www.seesaw.it/en/toolbox/widgets/) and will_paginate (http://rock.errtheblog.com/will_paginate).<BR/><BR/>I came across several approaches to making will_paginate ajax enabled (e.g. http://railsontherun.com/2007/9/27/ajax-pagination-in-less-than-5-minutes). I found the best solution to be at Redline (http://weblog.redlinesoftware.com/2008/1/30/willpaginate-and-remote-links).<BR/><BR/>But I could not get tabnav ajax enabled (probably due to my lack of understanding of the plugin). So I copied and modified your code samples as they were more comprehensible.<BR/><BR/>Code extracts are as follows:<BR/><BR/>*** rhtml ***<BR/>:<BR/>:<BR/>< div id="topnav" class="tabNav"><BR/> < % tabs = [<BR/> { :name => 'Documents', <BR/> :options => {:url => {:action => "render_tabs", :tab => 'documents', :id => person},<BR/> :update => 'person_tab',<BR/> :before => "Element.show('spinner')",<BR/> :complete => "Element.hide('spinner')"}},<BR/> { :name => 'Tasks', <BR/> :options => {:url => {:action => "render_tabs", :tab => 'tasks', :id => person},<BR/> :update => 'person_tab',<BR/> :before => "Element.show('spinner')",<BR/> :complete => "Element.hide('spinner')"}}<BR/> ] %><BR/> <BR/> < %= build_tablist tabs, false % ><BR/>< /div><BR/>< br />< br /><BR/>< div id="person_tab" >< /div><BR/>:<BR/>:<BR/><BR/>*** tab helper ***<BR/><BR/>module TabsHelper<BR/> def make_tab(tab)<BR/> "< li>" + link_to_remote(tab[:name], tab[:options]) +"< /li>"<BR/> end<BR/>:<BR/>:<BR/>*** controller ***<BR/>:<BR/>:<BR/>def render_tabs<BR/>:<BR/> render :partial => "/documents/list", :locals => {:documents => @authored_documents}<BR/>:<BR/>end<BR/>:<BR/>:Anonymousnoreply@blogger.comtag:blogger.com,1999:blog-1502761093196431512.post-66886495897784840822008-03-13T18:04:00.000+11:002008-03-13T18:04:00.000+11:00Oh, and would you be willing to share your tips on...Oh, and would you be willing to share your tips on converting for use with link_to_remote? :)Taryn Easthttps://www.blogger.com/profile/00647732421144825421noreply@blogger.comtag:blogger.com,1999:blog-1502761093196431512.post-45513963346848450262008-03-13T08:39:00.000+11:002008-03-13T08:39:00.000+11:00Thanks - glad it's useful for you!Thanks - glad it's useful for you!Taryn Easthttps://www.blogger.com/profile/00647732421144825421noreply@blogger.comtag:blogger.com,1999:blog-1502761093196431512.post-55613113049618122682008-03-13T03:19:00.000+11:002008-03-13T03:19:00.000+11:00Thanks for showing how to do tabbed navigation in ...Thanks for showing how to do tabbed navigation in Rails so efficiently.<BR/><BR/>I was using tabnav plugin but it is way too complex and I couldn't get it to work with ajax / link_to_remote. I was able to copy your code and modify it successfully to use link_to_remote. I now intend replacing all my tabnavs with variants of your helpers.Anonymousnoreply@blogger.com