Jump to content

Remember Menu State


SharkBait

Recommended Posts

I have this little bit of code:

[code]
function toggleMenu(objID) {
//if(!document.getElementByID) return;
//alert(objID);

var ob = document.getElementById(objID).style;
ob.display = (ob.display == 'block')? 'none' : 'block';
}
[/code]
This is the sample HTML
[code]
<div class="navcontainer">
Main Menu <span><a href="javascript:void(0);" onclick="toggleMenu('leftMainMenu')">+</a></span>
<div id="leftMainMenu" class="navsub" style="display: none;">
<ul>
<li><a href="index.php">Home</a></li>
<li><a href="profile.php">Profile</a></li>
<!-- <li><a href="search.php">Search</a></li> -->
<li><a href="view_notes.php">View Notes</a></li>
<li><a href="javascript:OpenWindow('avgs.php')">Averages</a></li>
<?php
if($USERLEVEL >= $TESTER) {
echo "<li><a href=\"test.php\">Test Units</a></li>\n";
}
?>
<li><a href="prev_counter.php">Check Build Totals</a></li>
<!-- <li><a href="faq.php">Testing Help</a></li> -->
</ul>
</div>
</div>
[/code]

To help me expand and collapse menus.  How would I go about saving the state with a cookie or session so that when the page refreshes the menu blocks don't close?
Link to comment
https://forums.phpfreaks.com/topic/24141-remember-menu-state/
Share on other sites

Well to set a cookie with javascript you can use the following method.

[code=php:0]
document.cookie = 'cookiename=cookievalue; path=/';
[/code]

For something like this I would not enter a experation date for the cookie. If you don't then if the user closes the broswer the cookie will no longer be vaild

Now to read a cookie with javascript

[b]edit[/b]

I found a nice javascript cookie tutorial for you. http://www.the-cool-place.co.uk/javascript/tutorial/javascript3.html

Hope this helps,
Tom
Link to comment
https://forums.phpfreaks.com/topic/24141-remember-menu-state/#findComment-109809
Share on other sites

If someone is interesting in what it looks like these are the scripts:

[code]
function checkMenuState() {

var aMenus = Array("leftMainMenu", "leftSearchMenu", "counterTable", "failureTable");

for (x in aMenus) {
//alert(aMenus[x]);
ob = document.getElementById(aMenus[x]).style;
ob.display = getCookie(aMenus[x]);
}
}
[/code]
[code]
function toggleMenu(objID) {

var ob = document.getElementById(objID).style;
//ob.display = (ob.display == 'block')? 'none' : 'block';
if(ob.display == 'block') {
ob.display = 'none';
} else {
ob.display = 'block';
}
setCookie(objID, ob.display)
}
[/code]

[code]
function setCookie(cookieName, cookieValue, cookieExp) {
// Set the cookie information
if(cookieExp != null) {
// Cookie has a duration / date object is expected
document.cookie=cookieName + "=" + escape(cookieValue) + ";path=/;expires=" + cookieExp.toGMTString();
} else {
document.cookie=cookieName + "=" + escape(cookieValue) +";path=/";
}
}
[/code]
[code]
function getCookie(cookieName) {

var cookieValue;
// Obtain the Cookie information
cookieString = document.cookie

// Get each element in the cookie
cookieArray = cookieString.split(";");

if(cookieString.length > 0) {
// A cookie is present - loop through them
for (x in cookieArray) {
// Split the cookie value into name/value
cookieValues = cookieArray[x].split("=");
// trim any extra whitespaces from the value
cookieValues[0] = trim(cookieValues[0]);

if(cookieName == cookieValues[0]) {
// Found a Match - get the value
cookieValue = cookieValues[1];
}
}
// return the value of the cookie
return unescape(cookieValue);
} else {
return null;
}
}
[/code]

Now in the HTML  in my header page I use:
[code]
<body OnLoad="javascript:checkMenuState();">
[/code]
To ensure the menu's load their state correctly on page-refreshes etc

In the menu sections I just do a simple OnClick call to toggleMenu():
[code]
<a href="javascript:void(0);" OnClick="toggleMenu('failureTable')">+</a>
[/code]

And voila, it works nicely :)

Link to comment
https://forums.phpfreaks.com/topic/24141-remember-menu-state/#findComment-110087
Share on other sites

  • 2 weeks later...
I havent changed the code but IE isnt liking it any more and doesn't remember the menu's state.

Firefox handles it fine but in the Javascript Console I get this error:

Error in parsing value for property 'display'. Declaration dropped.  Line: 0

Well nothing on line 0 so I am not sure where to look.
Link to comment
https://forums.phpfreaks.com/topic/24141-remember-menu-state/#findComment-115008
Share on other sites

[quote author=SharkBait link=topic=111699.msg458204#msg458204 date=1161889685]
I havent changed the code but IE isnt liking it any more and doesn't remember the menu's state.

Firefox handles it fine but in the Javascript Console I get this error:

Error in parsing value for property 'display'. Declaration dropped.  Line: 0

Well nothing on line 0 so I am not sure where to look.
[/quote]

Isn't the correct syntax element.style.display?  That might be the cause of your problem.
Link to comment
https://forums.phpfreaks.com/topic/24141-remember-menu-state/#findComment-115078
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.