0

Further to this question - and using the same getUrlParam.js plugin.

$(document).ready(function(){
var param = $(document).getUrlParam('tab');
$("#tabs").tabs();
$("#tabs").tabs('select', param);
});

With this code I am able to control which tab loads on a given page e.g. blogs/?tab=tv loads the tab #tv on the /blogs/ page.

However is there a way I can set the URL by clicking on the tabs themselves?

<ul id="mediatabs" class="tab-buttons">
<li class="TV"><a href="#TV">TV</a></li>
<li class="radio"><a href="#radio">Radio</a></li>
</ul>

i.e. clicking on the TV tab loads /?tab=tv?

I guess this is a workaround for the missing bookmarking functionality in Tabs 3.

Community
  • 1
  • 1
strangerpixel
  • 798
  • 1
  • 11
  • 27
  • are you asking how to add a click handler to the tab? – geowa4 Sep 22 '09 at 15:09
  • @geowa4: Yes, I think he wants to make it so that you can click anywhere in the tab, not just on the `a` link within. – Adam Bellaire Sep 22 '09 at 15:16
  • No - I want to click the tab (the li block) and change the URL. Same as standard tabbing (i.e. #us, #them) - but with the plugin, so I can link in from an external page/site. Tks – strangerpixel Sep 23 '09 at 20:56

1 Answers1

0

Well, you're wanting to change a querystring parameter and not the hash of the url (http://www.example.com/page.html#this-is-a-hash). One approach is to use the select event which is triggered whenever a tab is clicked. Something like:

$('#tabs').bind('tabsshow', function(event, ui) {
    // TODO: compute the desired url and set window.location.href
});
Ken Browning
  • 28,693
  • 6
  • 56
  • 68
  • Yes you are right. And I've been trying to make it workable in that way.However. it does not work!!! window.location.href will take you away from tabs and open a new screen. – codebased Mar 09 '11 at 03:53