Ajax Tabbed Browsing

Rails
1

I was wondering if anyone has done this, namely make tabbed browsing
exactly like a web browser, but have it within the page.

I would like to make a search function that updates a section of the
page with the results, as well as makes a new tab that displays those
search results. Then, if a user did 5 searches, there would be 5 tabs.
Each tab would hide the other 4 results and show the results for its
search.

Thanks,
Ben L.

2

Ben L. wrote:

I was wondering if anyone has done this, namely make tabbed browsing
exactly like a web browser, but have it within the page.

I would like to make a search function that updates a section of the
page with the results, as well as makes a new tab that displays those
search results. Then, if a user did 5 searches, there would be 5 tabs.
Each tab would hide the other 4 results and show the results for its
search.

Thanks,
Ben L.

As a jQuery evangelist, I would point you to the jQuery tabs plugin
(http://stilbuero.de/demo/jquery/tabs.html), which does a damn good job.
I’m fairly confident you can port the code to Prototype if necessary.

Either way, you’d use AJAX to add the necessary markup and use the
tab-alizer to convert the markup to tabs.

3

Blair Z. wrote:

Ben L. wrote:

Ben L.
A colleague of mine has used the Dojo tabs for exactly this.

http://dojotoolkit.org/

Click on the “see it in action” tab, then the “Layout Widgets” then look
for
TabContainer.

Regards,
Blair

Blair, that’s really cool! I think I’ll use it. Any idea how your
colleague stylized the tabs?

Thanks again,
Ben L.

4

Ben L. wrote:

Ben L.
A colleague of mine has used the Dojo tabs for exactly this.

http://dojotoolkit.org/

Click on the “see it in action” tab, then the “Layout Widgets” then look
for
TabContainer.

Regards,
Blair

5

Blair Z. wrote:

Ben L. wrote:

Regards,
Blair

Blair, that’s really cool! I think I’ll use it. Any idea how your
colleague stylized the tabs?

No, he didn’t do much stylizing at all, just using the basic code and
look.

Regards,
Blair

Incase he wanted to stylize it, I found the pictures. They are located
in /src/wiget/templates/images and most of them are called names like
tab_top_right. I can’t seem to get the css file to change the
appearance though.

It looks really nice, but a problem I’m having is the load time of it.
When I put it in a div on my page, everything loads except for dojotabs.
After the rest of the page is done, dojo tabs loads. I’d be interested
to see a page your colleague made with dojotabs, to see if he has the
same problem.

-Ben L.

6

Ben L. wrote:

Blair
same problem.
Dojo does appear to take a while to load. However, the site is an
internal IT
project and not accessible from the outside world to see.

I’m afraid I can’t help much more than the help I’ve already provided.

Regards,
Blair

7

Blair Z. wrote:

Thanks,
Blair
If you just wanted to know if conceptually someone is using it in web
apps, then Yahoo! mail is one such site, but I don’t think it’s on Rails
:S
Cheers,
Mohit.

8

Ben L. wrote:

Regards,
Blair

Blair, that’s really cool! I think I’ll use it. Any idea how your
colleague stylized the tabs?

No, he didn’t do much stylizing at all, just using the basic code and
look.

Regards,
Blair