ADF Query Component Usage with ADF Panel Stretch Layout

There is a very nice layout component in ADF 11g - af:panelStretchLayout (ADF Panel Stretch Layout). This component comes with 5 facets - Bottom, Center, End, Start and Top. It allows to split your page layout in more easy way - you can put menu component into Top facet, functional logic into Center facet.

Everything seems okej and clear, however there is hidden issue when you need to have menu elements in Top facet dependent on ADF Query from Center facet. For example, menu item can be enabled/disabled based on ADF Query results:


It will not work for you by default, during initial page rendering. Because when menu items in Top facet are rendered, ADF Query from Center is not initialized yet - iterator will bring all rows. This means, even if ADF Query is configured not to bring any results by default, in Top facet all rows still will be visible. ADF Panel Stretch Layout facets are rendered in following order - Top, Start, Center, Bottom and End.

Steve Muench proposed to initialize ADF Query in Top facet by referencing Query Model. And it works - menu is rendered correctly. You can download my sample application - PanelStretchLayoutADFQuery.zip where this solution/workaround is implemented.

I'm referencing Query Model for ADF Query from hidden (visible = false) af:outputText component I have created in Top facet right before Menu items:


This allows to initialize ADF Query before actually rendering complete af:query component.

At runtime, when your page will be rendered, you will have correct behavior - menu item disabled when there are no results by default:

Menu item becomes enabled when results table is populated:


Popup opened from menu item to edit data for selected row:


Data in popup is updated when selecting other row:


Just quick note, by default data in Popup will not be changed, you need to set ContentDelivery=lazyUncached property for af:popup component in order to have correct behavior:


Spanish Summary:

ADF Panel Stretch Layout es un componente del tipo panel que podemos usarlo para organizar la página. Este componente esta compuesto de 5 facets(regiones) en donde podemos colocar otros componentes visuales.

Una de las prácticas más comunes con los panelStretchLayout es incluir en la región superior (TOP) un menú que obtienen su información en base a un componente ADF Query ubicado en la región CENTER. Bien, este tipo de disposición tiene un inconveniente por el orden en el cual se construyen los componentes. Por ello Andrejus ofrece en este post uno tips que nos ayudan a solucionar estos inconvenientes.