O'Reilly logo

jQuery UI Cookbook by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Working with remote tab content

The tabs widget knows how to populate a given tab panel with remote content out of the box. It's all about how we specify the tab links. For example, an href attribute that points to #tab-content-home will load the content using the HTML found in that element. But, if instead of pointing to an already-existing element we point to another page, the tabs widget will load the content into the appropriate panel on demand.

This works as expected without passing options to the tabs, but there is the beforeLoad option should we want to tweak the behavior of the Ajax request in an any way. Let's take a look at some of the ways we can work with remote content using the tabs widget.

How to do it...

First, we'll create the HTML ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required