2

I have a webpage which has three tabs, and depending on which tab is clicked, the appropriate content is visible. This showing/hiding of the content on clicking of tabs is handled by Javascript.

My issue is, if I am viewing the third tab and then refresh the page, the page does not refresh to the third tab's contents being visible but instead, back to the first tab's contents.

Is there any way, when the javascript executes, for me to add a GET parameter to the URL, so on page load my PHP script can check for the GET parameter and display the correct content?

Ayush
  • 41,754
  • 51
  • 164
  • 239

3 Answers3

3

You have a few options:

  • use a fragment identifier (add something like #tab3 to the URL)
  • store in a cookie
  • use local storage

Depending on what browsers you want to support and how long you want to persist the option you can pick any of them.

deviousdodo
  • 9,177
  • 2
  • 29
  • 34
2

Addtab id to the URL as an anchor when tab is clicked, e.g. http://www.mysite.com/page.html#tabId

Then when page loads you check for presence of tab id in url and activate required tab

Igor Nikolaev
  • 4,597
  • 1
  • 19
  • 19
  • I did consider a # anchor but am not sure how to check for it in my PHP script when the page loads. Would I have to use regex for that? – Ayush Nov 09 '11 at 13:50
  • Yon can make it client side also in JavaScript. But anyway, you will have to parse URL and take everything after # as tab id. – Igor Nikolaev Nov 09 '11 at 13:58
  • You can also put parameters after # sing as a key=value, that will be easier to find them when you have multiple parameters. – Igor Nikolaev Nov 09 '11 at 14:06
0

You can use cookie, or link hash. For example: http://jqueryfordesigners.com/api-filter-find/

rsboarder
  • 4,592
  • 3
  • 20
  • 21