CODEWITHSUNDEEP
javascriptextjsextjs4
AMember
AMember

Reputation: 3057

Create a custom collapse panel - Extjs 4.0a2

ok here is an easy one. I need to create a simple custom panel that will have a collapse functionality. The thing is I need to control over the collapse button position, and I need to control the collapsed mode UI (that is I want the panel to show somethings in collapsed mode and not just the title.

for example : I want to create a search panel that will be nested in a viewport above a the pages of the application. each page will have access to the search panel title and its advance search form which is collapsible. in a collapse mode only a simple search and the title are visible.

here is an image before the collapse: (once clicking the circled arrow the panel will expand to show the advance search) once clicking the circled arrow the panel will expand to show the advance search

here is an image after the collapse: enter image description here

how would you go about to implement such functionality?

Upvotes: 1

Views: 1224

Answers (1)

Chao
Chao

Reputation: 1058

I would use two panels in a vbox layout, the top one contains the basic search, and the bottom one contains the advanced search.

In the top panel I would just add an image of a down arrow and handle the onclick event to toggle the bottom panel.

Upvotes: 2

Related Questions