Contractible Headers problem

[huntr77]

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

[jscheuer1]

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:

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:

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.

[huntr77]

Genius, works perfectly. Thanks Mad Professor!

[button1]

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

[jscheuer1]

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:

<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:

<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:

<script>
<!--

and

//-->
</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:

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:

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

[button1]

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

[button1]

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

[jscheuer1]

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.

[button1]

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)