Non-expandable items in CJuiWidget

Hi everybody!

This is my first post to the Yii forum. Personally, I prefer reading about similar use cases when I have a problem, but this time it seems that I can not find the solution anywhere.

I would like to use the CJuiAccordion widget, but I need to make a vertical accordion menu in which only two top-level items are expandable, and the rest are just with links to somewhere. All top-level items (whether expandable or not) should be of the same CSS design.

If we paraphrase the code provided in the widget documentation, this should look like:

$this->widget('zii.widgets.jui.CJuiAccordion', array(

	'panels'=>array(

    	'panel 1'=>'content for panel 1',

	// panels 2-4 should be non-expandable

    	'panel 2'=>'<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/huh.gif' class='bbc_emoticon' alt='???' />',

    	'panel 3'=>'<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/huh.gif' class='bbc_emoticon' alt='???' />',

    	'panel 4'=>'<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/huh.gif' class='bbc_emoticon' alt='???' />',

    	'panel 5'=>'content for panel 5',

	// panel 6 should be non-expandable

    	'panel 6'=>'<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/huh.gif' class='bbc_emoticon' alt='???' />',

	),

	// additional javascript options for the accordion plugin

	'options'=>array(

    	'animated'=>'bounceslide',

	),

));

I tried various things, but somehow if I turn off content printing, it shifts, and the whole menu becomes a disaster

Any ideas about how to tweak the menu so that it can have non-expandable items?

Perhaps some changes in .js files are necessary?

Hi and welcome.

I think it’s not possible out of the box.

But you may want to create your own extension of the CJuiAccordion class in order to specify special panels which are not panels in fact.

Check also the resulting HTML code with a standard widget. What you’d need is an <h3> only and not the following <div>. Keep the class names in order to get the same style.

Thank you very much for your explanation and ideas! Indeed, it looks like it would be possible to solve by extending the CJuiAccordion class.

Luckily, Yii allows to do such things in quite a clear way.

However, I did find an easier solution: JQ Vertical Accordion Menu by Design Chemical. It does everything I need. I just needed to write encapsulating .php file, and put it into "extensions" folder.

Thanks again