Results 1 to 3 of 3

Thread: (Tutorial) Tab Content - Select All switch

  1. #1
    Join Date
    Jul 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default (Tutorial) Tab Content - Select All switch

    1) Script Title:
    Tab Content Script

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

    3) Describe problem:
    This is an addition

    For all of you that want to show all of the content contained in the tab, but don't want to repeat it for printing purposes, make this change to your tabcontent.js script. You need to cut and paste the whole function as I rearranged things.

    USAGE: put a DIV named selectall in your tabs, when selected, it will display the content of all the tabs.
    Code:
    function expandcontent(linkobj){
    var ulid=linkobj.parentNode.parentNode.id //id of UL element
    var ullist=document.getElementById(ulid).getElementsByTagName("li") //get list of LIs corresponding to the tab contents
    for (var i=0; i<ullist.length; i++){
    ullist[i].className=""  //deselect all tabs
    
    linkobj.parentNode.className="selected"  //highlight currently clicked on tab
    if (typeof tabcontentIDs[ulid][i]!="undefined") //if tab content within this array index exists (exception: More tabs than there are tab contents)
    	document.getElementById(tabcontentIDs[ulid][i]).style.display="none" //hide all tab contents
    // HERE'S THE CHANGE - SELECTS ALL WHEN DIV="selectall" 
    if (linkobj.getAttribute("rel")=="selectall") {
    	document.getElementById(tabcontentIDs[ulid][i]).style.display="block" //expand corresponding tab content
    }
    }
    linkobj.parentNode.className="selected"  //highlight currently clicked on tab
    document.getElementById(linkobj.getAttribute("rel")).style.display="block" //expand corresponding tab content
    saveselectedtabcontentid(ulid, linkobj.getAttribute("rel"))
    }
    
    function savetabcontentids(ulid, relattribute){// save ids of tab content divs
    if (typeof tabcontentIDs[ulid]=="undefined") //if this array doesn't exist yet
    tabcontentIDs[ulid]=new Array()
    tabcontentIDs[ulid][tabcontentIDs[ulid].length]=relattribute
    }

  2. #2
    Join Date
    Jul 2006
    Posts
    31
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Couldn't get this to work properly.

    Only the added tab (rev = "selectall") will show content but all other tabs have javascript error:
    Error: document.getElementById(tabcontentIDs[ulid][i]) has no properties

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I couldn't get it to work either, see:

    http://www.dynamicdrive.com/forums/s...3&postcount=12

    where I made up my own solution for this idea.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •