PDA

View Full Version : nested ddaccordion won't collapse subexpandable and expandable



studio-18
06-15-2009, 10:18 AM
1) Script Title: ddaccordion.js (version1.7.1)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm

3) Describe problem:

I implemented a nested type of the ddaccordion script on my dynamic web template (xhtml). Tested the skript (works fine)

Now I tried to implement some kind of an "gotoindex" button where i defined an "onclick" event wich should do two things:

move back to my index.htm page and collapse all expandable categoryitems and subexpandabale subcategoryitems.

I tried it in several ways but the menu won't collapse the items. They are quivering but not closing. Would be thankful for any suggestion how to do it.

Here is my init function:


ddaccordion.init({ //top level headers initialization
headerclass: "expandable", //Shared CSS class name of headers group that are expandable
contentclass: "categoryitems", //Shared CSS class name of contents group
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
// mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "normal", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing
}
})

ddaccordion.init({ //2nd level headers initialization
headerclass: "subexpandable", //Shared CSS class name of sub headers group that are expandable
contentclass: "subcategoryitems", //Shared CSS class name of sub contents group
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click" or "mouseover
//mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["opensubheader", "closedsubheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "normal", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing
}
})


Here is the <a> Tag where i throw the collapseall function:

1st. Case:

<a href="../sites/index.htm" class="Sitemap" style="color:#660066" onclick="ddaccordion.collapseall('subexpandable'); ddaccordion.collapseall('expandable'); return false;">Startseite </a>

Result: The Menu is Collapsing completely but the href site won't be loaded afterwards.

2nd. Case: (without the return flag)

<a href="../sites/index.htm" class="Sitemap" style="color:#660066" onclick="ddaccordion.collapseall('subexpandable'); ddaccordion.collapseall('expandable');">Startseite </a>

The Menu tries to collapse (the entries are quivering) without success and the href site will be shown.

At first I tried to close the menu with the "expandable" part only, but this is just a working solution for a ddaccordion menu without nests.

Thanks for any suggestion

yoyo01
06-16-2009, 09:03 AM
I have the same problem, have tried looking through the forum for a solution, but can't seem to get it to work. Either the menu collapses but the page doesn't load, or the page loads but the menu tries to collapse but then opens again.

yoyo01
06-16-2009, 09:13 AM
I seem to have resolved the issue by inserting an empty list tag:


<h3 class="menuheader expandable"><a href="contact.php">contact</a></h3>
<ul class="categoryitems">
<li></li>
</ul>

Not really the best way to do it, but at least now the menu item receives the 'active' class as well.

studio-18
06-16-2009, 10:01 PM
looks like there are not so many people who tried to collapse all in nested menues

we did't a lot of debuggin in the last day's

i will try doing it the same way, and start some test on the resulting behavior


The collapse all on subexpandable and expandable is working function even in nested menues! we build in a dummy " window.oben() " after the collapseall and it's been working so we tought that it is a matter of time if the menu is closing.

studio-18
06-16-2009, 10:39 PM
Could you be so kind posting a litle bit more of your Sourcecode

i'd like to see how you built in the ddaccordion.collapseall('subexpandable')
in my case i can't handle the behaviour with an empty list element.

my first problem is to figure out what's going on with the "return false"; command
as soon as is i built in the command my menu is collapsing but doesn't locate the href url !
without the return flase flag the hfref will be located but the menu won't collapse