Tabs load by ajax instead of using div element ids because of base tag

Having the <base> tag in your HTML causes annoying problems with jQ UI Tabs. Because now in 1.9 tabs load via AJAX if the tab link HREF differs from location.href.

Consider the following scenario using Codeigniter framework:

• Page /admin/pages/index has a button "Add new page" with HREF "/admin/pages/add_page"
• Clicking said button uses AJAX and for example Fancybox to open a modal dialog window
• The page fetched via AJAX contains <div> elements with ID #tab1 and #tab 2
• jQ UI Tabs is called on those

Now, what happens is that due to the <base> tag jQuery UI considers those tabs as not local.

Yeah sure, just fix the URL right? Not that simple. Inside Codeigniter the URL has already changed to /admin/pages/add_page, which is different from the /admin/pages/index that jQuery UI expects as location.href hasn't changed. Basically you have to manually fill in the correct URL so that the tabs load correctly. What happens is this makes the page unusable anywhere other than /admin/pages/index as you have to get the url of the containing page somehow.

The behavior introduced in 1.9 is obviously not making anything easier for developers especially when using frameworks where using the <base> tag is generally very beneficial.

As a solution you should either

a) add an option to force the tabs to be detected as local

b) add the ability to detect the <base> tag