PDA

View Full Version : **.parentNode.onclick



Nutty
September 5th, 2007, 05:15 PM
Hi,

Hi i'm creating a tree-like menu.
When i click on the top btn the submenu opens, and when i click again it closes.
Now, the problem is that if the submenu is open and i click on a submenu item, the submenu closes. I want it to stay open.

this is my menu:

<ul id="contentMenu" class="contentMenu">
<li><a>Main settings</a>
<ul>
<li><a href="#">Database settings</a></li>
<li class="last"><a href="##">Administator settings</a></li>
</ul>
</li>
<li><a>User management</a>
<ul>
<li><a href="#">New user</a></li>
<li><a href="#">Edit users</a></li>
<li class="last"><a href="##">Delete users</a></li>
</ul>
</li>
<li><a href="#">Admin logs</a></li>
</ul>
<script type="text/javascript">createMenu("contentMenu");</script>
this is my javascript code:

createMenu = function(menuId) {
var ulTags=document.getElementById(menuId).getElements ByTagName("ul");
for(var i=0; i<ulTags.length; i++) {
ulTags[i].parentNode.className="hideSubMenu";
ulTags[i].parentNode.onclick = function(e) {
if(this.className=="subMenu") { this.className="hideSubMenu"; } else { this.className="subMenu"; }
}
}
}Any help would be appreciated!

thx,
Waldo

MTsoul
September 7th, 2007, 03:01 PM
I had this problem while making a Javascript drag and drop page. Because the submenu LIs are inside the UL, any clicking of the LIs would also trigger the onclick event of the parent ULs. So if you click on a link, the menu actually disappears.

In your case, there is an easy fix (there isn't always an easy fix for this). Instead of applying the onclick event handler to the UL, apply it to the link inside the base LI - that is, Main settings, User management, and Admin logs. I guess you should also make the links have css display:block; property so it fills up the entire container.

Hope that helps.