Results 1 to 6 of 6

Thread: Ajax tabs: How can I jump to a certain tab using the url?

  1. #1
    Join Date
    Dec 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ajax tabs: How can I jump to a certain tab using the url?

    1) Script Title: Ajax Tabs Content Script (v 2.0)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tent/index.htm

    3) Describe problem:
    How can I jump to a certain tab using the url?

    For example, it would be great if I could put in an url like this:
    http://www.website.com/blah/index.php?tab=2
    and then the website would react like if "javascript: countries.expandit(2)" was executed.

    In other words it would grab the value after ?tab= and execute the expand-this-specific-tab function using that value.


    Would this be possible?

    Thanks in advance.

  2. #2
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    Code:
    var pageVars;
    
    function fillPageVars()
    {
    	var pageVarsTemp=(document.location.hash.length>1) ? document.location.hash.substring(1).split('&') : new Array(0);
    	if (pageVars)
    		delete pageVars;
    	pageVars=new Object();
    	for (var i=0; i<pageVarsTemp.length; i++)
    	{
    		var tempArray=pageVarsTemp[i].split('=');
    		pageVars[tempArray[0]]=tempArray[1];
    	}
    }
    The function above fills the "pageVars" variable from the URL and you can use the "GET" parameters like in PHP. BUT this code uses the anchor, #, not the common ? seperator since if you change the url's ? part it reloads the page, however if you change after the anchor it does not reload.

    So you can use a function which looks for pageVars["tab"] variable and then expands the tab according to it. If you want to do this only when the page loads, you can call that function from onLoad, if you want to change the active tab wehenever the url changes, then put your function in an interval.

  3. #3
    Join Date
    Dec 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Maybe I'm not getting this fully.. But I put the code you provided in (inside <script> tags ofc)

    and added:
    document.write(pageVars["tab"[0]]);

    and thereafter:
    document.write(pageVars["tab"]);

    but neither returned anything when using urls like this:
    http://krof.net/start/#tab=test

  4. #4
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Please see this thread, which basically shows the technique to selecting a particular tab via a URL parameter: http://www.dynamicdrive.com/forums/s...ad.php?t=26799

  5. #5
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    Quote Originally Posted by Krofinzki View Post
    Maybe I'm not getting this fully.. But I put the code you provided in (inside <script> tags ofc)

    and added:
    document.write(pageVars["tab"[0]]);

    and thereafter:
    document.write(pageVars["tab"]);

    but neither returned anything when using urls like this:
    http://krof.net/start/#tab=test
    After inserting the code, you should call the function, fillPageVars(), for pageVars variable to be defined. But instead of trying to workout this, I think you can have a look at the link which ddadmin gave

  6. #6
    Join Date
    Dec 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I ended up using the solution in the link ddadmin provided, works great

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •