O'Reilly logo

Ext JS 4 Web Application Development Cookbook by Stuart Ashworth, Andrew Duncan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Collapsible layouts with accordions

Accordion layouts allow us to present multiple containers in a fashion where only one of the containers is expanded and visible at any one time. The other containers are collapsed, leaving only their headers visible, each of which can be clicked on to expand that content area and collapse the others.

This layout style is useful when only one area of content is required to be displayed at once. This might be because there isn't enough space to display everything at once or only one area is relevant at a time.

In this recipe, we will describe how to create an accordion layout to display some simple information about Sencha products. A screenshot of our final goal can be seen as follows:

How to do it...

  1. Once again ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required