ExtJS accordion setActiveItem

I am develo开发者_如何转开发ping an application using ExtJS. I have an Accordion and need to select an active item(so it expands). Accordion.setActiveItem outputs the following:

"setActiveItem" is not a function in a browser's error window.

Second issue is that hideCollapseTool property, when set to true in the initialisation, doesn't do anything. Collapse tools still are being displayed.

I am using ExtJS 3.1.1. I would be very thankful for any tips and answers.

I have had little luck with setActiveItem myself. Examining it in Firebug, the accordion panel doesn't even have that method.

What I did to get around it was to call expand() on the item I want to have focus, e.g. :

accordion.items.itemAt(2).expand();

You can also expand some item in an accordion panel by it's component id like this:

Ext.getCmp('myAccordion').expand();
Ext.getCmp('myAccordion').items.key('myAccordionPanel').expand();

I fixed it in a controller with a ref called userview

this.getUserview().items.items[1].expand();

Ext.getCmp('myAccordion').getLayout().setActiveItem(0); // First Child
Ext.getCmp('myAccordion').getLayout().setActiveItem(1); // 2nd Child and so on

I spent a good 6 hours wrestling with this. collapse() and expand() didn't seem to be working. I'd expand a panel under the accordion and other panels would break.

Finally figured out there is some issue that happens if your accordion is hidden and then you show() it right before collapse() and expand() operations on the sub-panels.

My workaround was to never set the accordion to "hidden=true" and never show() it. Instead, I used style={opacity:0} to begin and then set opacity:100 when I needed to see it. This fixed everything, but isn't the most graceful solution.