I have some script that programatically creates AccordionPanes based on information it finds via a datastore. I inserted in some alerts such that I could debug the code. It works with the alert in place ... however when I remove the alert statement, only one of the AccordionPanes (the selected one) is visible. I have looked at the generated page source, and the other AccordionPanes are being generated .. they just are not visible.

Here is my script:

dojo.addOnLoad(function() {
// Get the datasource description for the accordion panes

There is an “InvalidArgument”error when we are using AccordionPane for some scenarios. It looks like the layout function is causing the problem where the following calculation results a negative value for InternetExplorer (IE). However for other browsers it works fine.

“this._verticalSpace = (mySize.h - totalCollapsedHeight);”

Why this is returning a negative value for IE?

I have attached a sample HTML pages for testing this. Just try to load the Sample_index.html. You cant see the right hand side AccordionPane is not loading.

Sample_index.html

Why doesn't the children resize when I do the following? The main accordion container adapts but the accordion panes stay the exact same size.

This is the code after I set new content into a neighboring contentpane setting the heigh of the parent div.

var accordion = dijit.byId('my_accordion_div_id');
if(accordion){
	accordion.layout();
}

Hi. I have a strange situation where I put a Grid Widget inside an AccordionPane that is initially hidden. It should be of no surprise to anyone that when the AccordionPane is selected, the Grid widget is not dispalyed properly. (On my browser, it looks like the grid widget is smashed into a as small of a space as possible)

While working with Layout Widgets i noticed that if there are layout items within an accordionPane they do not get resized or have their layout correctly rendered. Looking into the source code it appears that it is a todo item to have the accordionPane call the resize function of its nested containers. Below are the changes i made to have the child layouts resize.

Be warned, I have not fully tested the solution on all cases!

I have a UI requirement that forces me to have on the same page two accordions. Additionally the request is that I style them differently. In the 0.3.x days there were two AccordionPane attributes that could be used to provide a hook. They were containerNodeClass and labelNodeClass. Using these two attributes each accordion pane could have a different look to them.

How can I accomplish something similar?

Thanks

When i place a Text box in an accordion container with some text in it and try to move the cursor in the textbox using Left and Right arrow keys of the keyboard, the accordion pane animation happens rather than the cursor to move inside the text box.

Is this the normal behavior of this widget? If not how to avoid this?