Results 1 to 9 of 9

Thread: Contractible Headers problem

  1. #1
    Join Date
    Nov 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Contractible Headers problem

    Script: Contractible Headers Script
    URL: http://www.dynamicdrive.com/dynamicindex1/navigate2.htm

    Hi there,

    Firstly thanks for the script!

    I have just applied this to a left-hand side bar on my site. The side bar is in an include file so it remains while browsing around the site.
    I have also set var enablepersist="on"

    The problem is when I jump from page to page. Each page retains its own setting of what has been expanded/contracted. Eg. I EXPAND a section on the Frontpage, and jump to About Us. That section will still be CONTRACTED. But if I go back to the Frontpage it will be EXPANDED again.

    Hope that makes sense.

    I know that I need to modify the session from ‘document’ to something more global, but Javascript is sadly beyond my VBScript brain.

    Please help!

    Bryan

  2. #2
    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

    Sounds like you are using this script, trying to get the value to persist site wide. The way the cookie code is setup, it is only saved for that particular page. I'm still fairly new to cookies but, this should make it work the way you want it to (tested out OK here on two copies of the demo, in FF and IE on the PC). Take out this part of the script:

    Code:
    function getselectedItem(){
    if (get_cookie(window.location.pathname) != ""){
    selectedItem=get_cookie(window.location.pathname)
    return selectedItem
    }
    else
    return ""
    }
    
    function saveswitchstate(){
    var inc=0, selectedItem=""
    while (ccollect[inc]){
    if (ccollect[inc].style.display=="block")
    selectedItem+=ccollect[inc].id+"|"
    inc++
    }
    
    document.cookie=window.location.pathname+"="+selectedItem
    }
    
    function do_onload(){
    uniqueidn=window.location.pathname+"firsttimeload"
    getElementbyClass("switchcontent")
    if (enablepersist=="on" && typeof ccollect!="undefined"){
    document.cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0" 
    firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load
    if (!firsttimeload)
    revivecontent()
    }
    }
    
    
    if (window.addEventListener)
    window.addEventListener("load", do_onload, false)
    else if (window.attachEvent)
    window.attachEvent("onload", do_onload)
    else if (document.getElementById)
    window.onload=do_onload
    
    if (enablepersist=="on" && document.getElementById)
    window.onunload=saveswitchstate
    
    </script>
    And replace it with this:

    Code:
    function getselectedItem(){
    if (get_cookie('savedstate') != ""){
    selectedItem=get_cookie('savedstate')
    return selectedItem
    }
    else
    return ""
    }
    
    function saveswitchstate(){
    var inc=0, selectedItem=""
    while (ccollect[inc]){
    if (ccollect[inc].style.display=="block")
    selectedItem+=ccollect[inc].id+"|"
    inc++
    }
    
    document.cookie = "savedstate="+selectedItem+"; path=/";
    }
    
    function do_onload(){
    uniqueidn="savedstatefirsttimeload"
    getElementbyClass("switchcontent")
    if (enablepersist=="on" && typeof ccollect!="undefined"){
    document.cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0" 
    firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load
    if (!firsttimeload)
    revivecontent()
    }
    }
    
    
    if (window.addEventListener)
    window.addEventListener("load", do_onload, false)
    else if (window.attachEvent)
    window.attachEvent("onload", do_onload)
    else if (document.getElementById)
    window.onload=do_onload
    
    if (enablepersist=="on" && document.getElementById)
    window.onunload=saveswitchstate
    
    </script>
    Notes: This is a session only cookie and will expire once all instances of the browser are close. When updating pages that use cookies, be sure to delete all cookies using your browser's tools and/or options, as well as your browsers cached files, before testing.
    - John
    ________________________

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

  3. #3
    Join Date
    Nov 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Genius, works perfectly. Thanks Mad Professor!

  4. #4
    Join Date
    Feb 2006
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Post

    I have just applied the Contractible Headers Script to a left-hand side navigation bar on my site as well. The side bar is in an include file so it remains visible while browsing around the site. I have also set the var enablepersist="on"

    The fix posted by jscheuer1 works great except one thing - when a user first accesses the site, selects a contractible header, then chooses a link, the resulting page does not display the Contractible Header opened. Only after the user selects the same link again the resulting page shows the contractible header opened

    My dilemma is I want the script to remember the state of the header structure (all the time) when the user navigates. I need the script to remember the headers last state when the user clicks.

    Any help would be greatly appreciated

  5. #5
    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

    Really should just work . Um one thing to try is, by all means use an include for the HTML portion of the Contractible Headers Script but, try linking the javascript portions of it to the page via a <script src= type of statement(s) with the script(s) in (an) external file(s). Here are some general guidelines on doing that:

    Use a text editor to save the script, call it 'file_name.js' where 'file_name' can be any valid file name of your choosing. Substitute the name of your external .js file for some.js in the below:

    HTML Code:
    <script src="some.js" type="text/javascript"></script>
    Common problems arise when:

    1 ) The script file is not in the directory specified. In the above example it must be in the same directory as the page(s) that use it. Below, it can be in the scripts directory off of the root of a domain:

    HTML Code:
    <script src="http://www.somedomain.com/scripts/some.js" type="text/javascript"></script>
    2 ) Opening, closing and/or 'hiding' tags are left in the external file. This means that you must strip:
    Code:
    <script>
    <!--
    and
    Code:
    //-->
    </script>
    and any of their many variations from the beginning and end of the external file.

    3 ) The external call (<script src="some.js" type="text/javascript"></script>) is not inserted into the page at the correct spot. The external call must be inserted at the same place on the page where the script was/would have been.

    4 ) Paths to other files (if) used by the script are no longer valid due to its location. This is only a problem if the external script is kept in a different directory than the page it was working on when it was an internal script. To correct this, use absolute paths inside the script. Absolute path examples:

    Code:
    http://www.somedomain.com/images/button.gif
    
    http://www.somedomain.com/~mysitename/index.html
    5 ) Inappropriately combining two or more scripts into one external file. Usually external scripts can be combined if one knows enough about scripting to do so properly. Even then it is possible to overlook something.

    A rule of thumb when testing is, if it won't work on the page, it won't work as an external file either.

    One other thing, if this is a DD script or any script that requires the credit remain for legal use, include the credit in the on page call, ex:

    HTML Code:
    <script src="some.js" type="text/javascript">
    /***********************************************
    * IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    * Visit DynamicDrive.com for hundreds of original DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    </script>
    Make sure to retain all the 'decorations', as these include begin and end javascript comment delimiters without which the script won't function.
    - John
    ________________________

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

  6. #6
    Join Date
    Feb 2006
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Thanks John,

    Stripping the JavaScript from the Contractible Headers script and adding it to an external .js file then calling this external file from each page works great! Fantastic!

    Thanks a million

    Bill http://www.ipopper.net

  7. #7
    Join Date
    Feb 2006
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Hi again jscheuer1

    Sorry I spoke too soon. Stripping the JavaScript from the Contractible Headers script and adding it to an external .js file then calling this external file from each page DOES NOT WORK.

    When a user first accesses the site, selects a contractible header, then chooses a link, the resulting page does not display the Contractible Header opened. Only after the user selects the same link again the resulting page shows the contractible header opened

    Bill

  8. #8
    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

    It could be a matter of where on the page the external call to the script is palced. Some trial and error may be involved.
    - John
    ________________________

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

  9. #9
    Join Date
    Feb 2006
    Posts
    22
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Hello John

    I really think I got it this time. I inadvertently removed the link to the external .js file from the Contractible Headers navigation include. Now that is back everything is working fine

    Much thanks

    Bill (button1)

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
  •