Functional Pattern Pattern Revision Technologies Keywords Publisher Publish Date Last Updated Date: Embeding Regions inside

PopUp Windows 2.8 JDeveloper 11g, ADF, ADF Faces, ADF Controller Pattern Team September 19. 2008 May 21, 2009

Problem Description
Regions can be incorporated into ADF Faces popup content to support potentially complex navigation through a series of pages to complete a task. Another important benefit of including regions within ADF Faces popups is content reuse. These great benefits make ADF Faces popups containing regions a commonly used application development pattern. Incorporating regions into <af:popup> content can seem similar to incorporating regions into a page, especially since an <af:popup> is actually considered part of a page. However, there are some important differences to keep in mind. When incorporating regions into <af:popup> content, the following default development constraints must be taken into consideration: <af:popup> content is created and executed when its corresponding page is initially displayed. Its not automatically refreshed when a <af:popup> is disclosed. When disclosing an <af:popup> subsequent times from the same page, region content isnt automatically refreshed and restarted from the beginning. An <af:popup> is not automatically dismissed when its region content completes via navigation flow. Likewise, when an <af:popup> is dismissed, its corresponding region content is not automatically considered complete. Therefore, resources used by the corresponding task flow (e.g. memory, DB transactions, etc.) are not released. Embeding Regions inside PopUp Windows

Functional Region components activate when their <af:region> UI component is invoked (component tree built), not when the component tree is rendered. Most JSF UI components build their component tree and wait until rendering to activate. The <af:region> UI component is different since it must first resolve its task flows target view to include the corresponding page fragment. Many of these default development constraints are the result of <af:popup> behavior being mainly client-side only. When a user discloses an <af:popup>, JavaScript on the client unhides the <af:popup> created previously when the page was initially displayed. When the <af:popup> is dismissed, JavaScipt on the client simply hides the <af:popup> again. In both cases, no event or request is sent to the server to refresh the region content or retrieve data based on the current application state. If the <af:popup> is displayed a second time, it simply redisplays the <af:popup> content remaining from the previous disclosure.

Technical Pattern Description

The following document describes the recommended development approach for the ADF Faces Popup + Region pattern. Other development approaches may be possible to achieve the same desired use case behavior. The development approach described in detail within this document is considered the most comprehensive and least complex approach.

The User Experience

The following application development use case represents the commonly desired behavior of an <af:popup> containing region content: 1. During application runtime, the user selects a button on a page. 2. An <af:popup> containing a region is disclosed. All content displayed within the <af:popup> is based on the current application state. 3. The user interacts with the region within the <af:popup> to facilitate a task. 4. When the task is completed, the user returns to the page by exiting the region via navigation flow or closing the <af:popup>. 5. The user selects the same button on the same page a second time. Embeding Regions inside PopUp Windows

Functional 6. Once again, the <af:popup> containing the region is disclosed. Region content is refreshed and restarted from the beginning. All content displayed within the <af:popup> is based on the current application state when the <af:popup> is disclosed the second time. It does not redisplay content from the previous disclosure.

The Artifacts
When incorporating regions into <af:popup> content, the following development constructs are recommend to implement the desired use case behavior: Dynamic Region used instead of a region to swap between an empty task flow and the real task flow. Ensures resources and memory for the real task flow are only allocation when the <af:popup> is disclosed and appropriately released when the <af:popup> is dismissed. <af:popup> contentDelivery controls when the <af:popup> delivers its content to the browser. When set to "lazyUncached" the <af:popup> markup is pulled down each time the <af:popup> is disclosed. <af:setPropertyListener> specified on the <af:popup> to swap the real task flow into the dynamic region when a popupFetch event is received. <af:region> regionNavigationListener defined on the <af:region> UI component to identify when the region completes (task flow exits via Embeding Regions inside PopUp Windows

Functional navigation flow to a task flow return activity). When executed includes logic to automatically hide the <af:popup>. If the region is not designed to exit, a regionNavigationListener is not required. <af:serverListener> specified on the <af:popup> to swap an empty task flow into the dynamic region when a popupClosed event is received.

Implementing the Pattern

Dynamic Region
Dynamic regions use an EL expression to determine their corresponding taskFlowId at runtime. This allows more advanced applications to dynamically specify the taskFlowId to execute within the dynamic region at different points in the application runtime. Other regions simply specify their corresponding taskFlowId as a static literal that cannot be changed. When a dynamic region taskFlowId changes at runtime, the dynamic region is automatically refreshed with new parameter values and restarted from its default activity. Dynamic regions lend themselves well to being used within <af:popup> content. If the <af:popup> is hidden, an empty task flow can be assigned to the dynamic region. When the <af:popup> is disclosed, the real task flow can be swapped in. This ensures task flow resources and memory are only allocated when the <af:popup> is disclosed and properly released when the <af:popup> is hidden.

Dynamic Region taskFlow Binding

A dynamic region page definition taskFlow Binding example is shown below:
<taskFlow id="dynamicRegion1" taskFlowId="${viewScope.PopupDynamicRegionBean.dynamicTaskFlowId}" xmlns="http://xmlns.oracle.com/adf/controller/binding"> <parameters> <parameter id="EmployeeId" value="#{pageFlowScope.employeeId}" xmlns="http://xmlns.oracle.com/adfm/uimodel"/> </parameters> </taskFlow>

Note: Dynamic regions (and other regions) are initially refreshed when
their parent page is first displayed. This includes those appearing within Embeding Regions inside PopUp Windows

Functional <af:popup> content. taskFlow Binding Refresh and RefreshCondition settings only control refreshing after the initial refresh. Therefore, application developers should ensure dynamic regions (or other regions) appearing within <af:popup> content dont result in errors due to unavailable data when the parent page is initially displayed. This is another benefit of assigning an empty task flow to a dynamic region appearing within <af:popup> content when the parent page is first displayed.

Dynamic Region Managed Bean

A dynamic region uses a managed bean to manage the value of the taskFlow Binding taskFlowId. An excerpt from a dynamic region managed bean example is shown below:
public class PopupDynamicRegion { private String taskFlowId = ""; private String popupTaskFlowId = "/WEB-INF/employeeupdate.xml#employee-update"; private String emptyTaskFlowId = ""; public PopupDynamicRegion() { } public String getDynamicTaskFlowId() { if(taskFlowId!=null) return taskFlowId; else return getEmptyTaskFlowId(); } public void setDynamicTaskFlowId(String newTaskFlowId) { taskFlowId = newTaskFlowId; } public String getEmptyTaskFlowId() { return emptyTaskFlowId;

Embeding Regions inside PopUp Windows

Functional
} public TaskFlowId getPopupTaskFlowId() { return TaskFlowId.parse(popupTaskFlowId); } }

Note: When a dynamic region taskFlowId EL expression evaluates to an

empty String (e.g.: "") the taskFlowId will be handled as an empty task flow. Currently, there isn't a constant of type TaskFlowId defined to represent an empty task flow.

Dynamic Region Input Parameters

When passing input parameters to dynamic regions within <af:popup> content an extra implementation step is required. Input parameters are still passed to a dynamic region by specifying <parameters> on the regions taskFlow Binding. The task flow definition for the dynamic region must also still specify corresponding <input-parameter-definition>s with the same names (e.g.: EmployeeId). The extra step comes in since input parameter values passed from the parent page to <af:popup> content should be accessed through a launcher component. Therefore, any input parameters should first be set as an <af:clientAttribute> (e.g.: employee). Once disclosed, the <af:popup> content can refer to the value passed using its launcher component (e.g.: #{source.attributes.employee}). An example of setting an <af:clientAttribute> is shown below. For an example of an <af:popup> retrieving a value passed from its launcher component, refer to the <af:setPropertyListener> section below.
<af:commandButton text="Update" clientComponent="true" id="updateEmployee" partialSubmit="true"> <af:clientAttribute name="employee" value="#{row.Empno}"/> <af:showPopupBehavior popupId="::popupRegion1"/> </af:commandButton>

Note: <af:showPopupBehavior> cancels any server-side event delivery

automatically. Therefore, any actionListener or action attributes on the parent component will be ignored. This cannot be disabled. For example, the following <af:setActionListener> would be ignored if included on the Embeding Regions inside PopUp Windows

Functional same <af:commandButton>:

<af:setActionListener from="#{row.Empno}" to="#{requestScope.empno}"/>

Note: There are several client services to manage layering, positioning,

dismissal, and modality. When a browser page is reloaded, these services are reinitialized resulting in dismissal of all open <af:popups>. For this reason, <af:popups> only support partial submit commands. Partial submit commands perform a postback to the server without reloading the page.

<af:popup> contentDelivery
To ensure <af:popup> markup will be delivered refreshed each time the <af:popup> is disclosed its contentDelivery attribute is set to lazyUncached. The contentDelivery default lazy only delivers markup when the <af:popup> is first disclosed and then caches it. The <af:popup> attributes launchVar and eventContext should be set as shown in the example below so popupFetch and popupClosed events produced when an <af:popup> is disclosed and dismissed can be utilized. These events provide the timing for when to swap the dynamic region taskFlowId.
<af:popup id="popupRegion1" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher"> <af:panelWindow id="window" title="Employee Popup" modal="true"> </af:panelWindow> </af:popup>

Note: When incorporating dynamic regions (or other regions)

into <af:popup> content an <af:panelWindow> should be used within the <af:popup>. An <af:popup> without an <af:panelWindow> is an inline selector popup with auto-dismissal behaviors making it unusable with dynamic regions (or other regions). If an < af:dialog> is used within the <af:popup> instead of an <af:panelWindow>, connecting the <af:dialog> buttons in the footer up with the task flow navigation in the dynamic region is a very complicated endeavor. Its much easier to use an <af:panelWindow> and incorporate any buttons into the dynamic region content. Embeding Regions inside PopUp Windows

Functional

<af:setPropertyListener>
An <af:setPropertyListener> is specified within an <af:popup> to swap the real task flow into a dynamic region when a popupFetch event is received just before the <af:popup> is disclosed. An example of swapping the popupTaskFlowId value into the dynamicTaskFlowId when a popupFetch event is received is shown below. For further details on these managed bean properties, refer to the Dynamic Region Managed Bean section of the document. An <af:setPropertyListener> can also be specified within an <af:popup> to pass values from the parent page set as an <af:clientAttribute>. These values might be required for dynamic region input parameters. The <af:setPropertyListener> retrieves these values from the <af:popup> launcher component when a popupFetch event is received. An example of retrieving the passed value of the <af:clientAttribute> employee from the launcher component is shown below.
<af:popup id="popupRegion1" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher"> <af:setPropertyListener from="#{source.attributes.employee}" to="#{pageFlowScope.employeeId}" type="popupFetch"/> <af:setPropertyListener from="#{viewScope.PopupDynamicRegionBean.popupTaskFlowId}" to="#{viewScope.PopupDynamicRegionBean.dynamicTaskFlowId}" type="popupFetch"/> <af:panelWindow id="window" title="Employee Popup" modal="true"> </af:panelWindow> </af:popup>

<af:region> regionNavigationListener
An <af:region> regionNavigationListener is required if the dynamic region within the <af:popup> provides the ability to exit via navigation flow to task flow return activities. The regionNavigationListener identifies when the region exits so the <af:popup> can be programmatically dismissed without the user manually selecting its close icon. Using the employee-update task flow definition below as an example, the regionNavigationListener would be performed after executing either the save or cancel task flow return activities to exit the task flow definition.

Embeding Regions inside PopUp Windows

Functional

A regionNavigationListener is specified on the <af:region> UI component as shown below.

<af:popup id="popupRegion1" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher"> <af:setPropertyListener from="#{source.attributes.employee}" to="#{pageFlowScope.employeeId}" type="popupFetch"/> <af:setPropertyListener from="#{viewScope.PopupDynamicRegionBean.popupTaskFlowId}" to="#{viewScope.PopupDynamicRegionBean.dynamicTaskFlowId}" type="popupFetch"/> <af:panelWindow id="window" title="Employee Popup" modal="true"> <af:region value="#{bindings.dynamicRegion1.regionModel}" id="dynam1" regionNavigationListener="#{viewScope.PopupDynamicRegionBean.navigationListener}"/> </af:panelWindow> </af:popup>

The regionNavigationListener method used to programmatically hide the <af:popup> when the task flow exists would be similar to the following:
public void navigationListener(RegionNavigationEvent event){ String newViewId = event.getNewViewId();

Embeding Regions inside PopUp Windows

Functional

// null new view id indicates the taskflow has ended if (newViewId == null) { RichRegion region = (RichRegion)event.getSource(); // look for the parent popup boolean found = false; UIComponent component = region.getParent(); do { if (component instanceof RichPopup) { found = true; } else { component = component.getParent(); if (component == null) { break; } } } while (!found); if (found) { // send script to the client to hide the popup FacesContext context = FacesContext.getCurrentInstance(); Service.getRenderKitService(context, ExtendedRenderKitService.class).addScript(context, "var popup = AdfPage.PAGE.findComponent('" + component.getClientId(context) + "'); popup.hide();"); } } }

<af:severListener>
An <af:severListener> is specified on the <af:popup> to swap an empty task flow into the dynamic region when a popupClosed event is received. But, since the popupClosed

Embeding Regions inside PopUp Windows

Functional event is a client side only event, an <af:clientListener> is also implemented to identify the popupClosed event then launch a custom event the <af:serverListner> can receive.
<af:popup id="popupRegion1" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher"> <af:setPropertyListener from="#{source.attributes.employee}" to="#{pageFlowScope.employeeId}" type="popupFetch"/> <af:setPropertyListener from="#{viewScope.PopupDynamicRegionBean.popupTaskFlowId}" to="#{viewScope.PopupDynamicRegionBean.dynamicTaskFlowId}" type="popupFetch"/> <af:panelWindow id="window" title="Employee Popup" modal="true"> <af:region value="#{bindings.dynamicRegion1.regionModel}" id="dynam1" regionNavigationListener="#{viewScope.PopupDynamicRegionBean.navigationListener}"/> </af:panelWindow> <af:clientListener method="popupClosedListener" type="popupClosed"/> <af:serverListener type="serverPopupClosed" method="#{viewScope.PopupDynamicRegionBean.swapEmptyTaskFlow}"/> </af:popup>

The following <script> is incorporated into the page containing the <af:popup> for the <af:clientListener> to perform when a popupClosed event is received. It invokes a server side callback custom event the <af:serverListener> can receive. Instead of incorporating JavaScript into the page, a custom JSP tag can be implemented to encapsulate the same behavior. For further details on implementing a custom JSP tag, refer to Appendix Implementing a Custom JSP Tag.
<script> function popupClosedListener(event) { var source = event.getSource(); var popupId = source.getClientId(); var params = {}; params['popupId'] = popupId;

Embeding Regions inside PopUp Windows

Functional
var type = "serverPopupClosed"; var immediate = true; AdfCustomEvent.queue(source, type, params, immediate); } </script>

The method called by the <af:serverListener> to swap the empty task flow into the dynamic region would be similar to the following:
public void swapEmptyTaskFlow(ClientEvent event) { setDynamicTaskFlowId(""); // if event delivery set to immediate=true, short-circuit to renderResponse. // Forcing an empty taskflow releases the bindings and view port. FacesContext context = FacesContext.getCurrentInstance(); context.renderResponse(); String popupId = (String) event.getParameters().get("popupId"); System.out.println("**** Swapping Empty Taskflow on popupClosed for " + popupId + " ****"); }

Interaction Behavior
<af:popup> Disclosed
1. Button/link is selected and invokes <af:showPopupBehavior> to identify the appropriate <af:popup> to disclose. 2. <af:popup> popupFetch event published. 3. <af:popup> popupFetch event received by <af:setPropertyListener>. 4. <af:setPropertyListener> assigns <af:clientAttribute> values from the parent page to pass into the <af:popup>. 5. <af:setPropertyListener> swaps the real task flow into the dynamic region. Embeding Regions inside PopUp Windows

Functional 6. taskFlow Binding of the dynamic region is refreshed and restarted since its taskFlowId has been changed. 7. <af:popup> popupFetch event delivers new markup to the browser and displays it to the user since <af:popup> contentDelivery=lazyUncached.

<af:popup> Dismissed By Selecting Close Icon

1. User dismisses <af:popup> by selecting the close icon. 2. <af:popup> popupClosed event published. 3. <af:popup> popupClosed event received by <af:clientListener>. 4. <af:clientListener> invokes <script> to publish custom event for server side callback. 5. Custom event for server side callback is published. 6. Custom event for server side callback is received by <af:serverListener>. 7. <af:serverListener> method swaps an empty task flow into the dynamic region. 8. taskFlow Binding of the dynamic region is refreshed and restarted since its taskFlowId has been changed. Memory and resources remaining from the previous taskFlowId are released appropriately. 9. If event delivery set to immediate=true, jump is forced to renderResponse phase. 10. Next time user discloses the <af:popup> its content will once again be refreshed.

<af:popup> Dismissed By Exiting Region

1. User dismisses <af:popup> by exiting the dynamic region via navigation flow to a task flow return activity. 2. <af:region> regionNavigationListener is performed. 3. <af:region> regionNavigationListener identifies the task flow has exited by newViewId=null. 4. <af:region> regionNavigationListener programmatically hides <af:popup>. 5. <af:popup> popupClosed event published. 6. <af:popup> popupClosed event received by <af:clientListener>. 7. <af:clientListener> invokes <script> to publish custom event for server side callback. 8. Custom event for server side callback is published.

Embeding Regions inside PopUp Windows

Functional 9. Custom event for server side callback is received by <af:serverListener>. 10. <af:serverListener> method swaps an empty task flow into the dynamic region. 11. taskFlow Binding of the dynamic region is refreshed and restarted since its taskFlowId has been changed. Memory and resources remaining from the previous taskFlowId are released appropriately. 12. If event delivery set to immediate=true, jump is forced to renderResponse phase. 13. Next time user discloses the <af:popup> its content will once again be refreshed.

Appendix Implementing a Custom JSP Tag

The ADF Faces Popup + Region pattern described within this document utilizes JavaScript embedded within page markup to publish a server side custom event when the popupClosed client side event is received. If the application developer prefers not to include JavaScript directly within page markup, a custom JSP tag can be created to encapsulate the same behavior. For example, an <adfdemo:closePopupDynamicRegionBehavior> custom JSP tag could accept a popupId, an event delivery immediate flag, and method as attributes. The method specified would be performed when the popupClosed client side event is received. The new custom JSP tag could be incorporated into an <af:popup> as shown in the example below.
<af:popup id="popupRegion1" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher"> <af:setPropertyListener from="#{source.attributes.employee}" to="#{pageFlowScope.employeeId}" type="popupFetch"/> <af:setPropertyListener from="#{viewScope.PopupDynamicRegionBean.popupTaskFlowId}" to="#{viewScope.PopupDynamicRegionBean.dynamicTaskFlowId}" type="popupFetch"/> <af:panelWindow id="window" title="Employee Popup" modal="true"> <af:region value="#{bindings.dynamicRegion1.regionModel}" id="dynam1" regionNavigationListener="#{viewScope.PopupDynamicRegionBean.navigationListener}"/> </af:panelWindow> <adfdemo:closePopupDynamicRegionBehavior popupId="popupRegion1" immediate=true

Embeding Regions inside PopUp Windows

Functional
method="#{viewScope.PopupDynamicRegionBean.swapEmptyTaskFlow}"/> </af:popup>

The #{viewScope.PopupDynamicRegionBean.swapEmptyTaskFlow} method specified by the custom JSP tag would be similar to the following:
public void swapEmptyTaskFlow(ClientEvent event) { setDynamicTaskFlowId(""); // if event delivery set to immediate="true", short-circuit to renderResponse. // Forcing an empty taskflow releases the bindings and view port. Boolean immediate = (Boolean)event.getParameters().get("immediate"); if (immediate != null && immediate) { FacesContext context = FacesContext.getCurrentInstance(); context.renderResponse(); } String popupId = (String)event.getParameters().get("popupId"); System.out.println("**** Swapping Empty Taskflow on popupClosed for " + popupId + " ****"); }

To create the custom JSP tag described above, the following items should be implemented: JSP Tag Library (*.tld) describes design time behavior of the custom JSP tag. Custom Tag Behavior Class (*.java) describes server side behavior of the JSP custom tag. Custom Tag Behavior JavaScript (*.js) describes client side behavior of the JSP custom tag. Resources (adfdemo.resources) specifies servlet resource files to include. No need to create if existing servlet resource already defined.

Embeding Regions inside PopUp Windows

Functional ResourceLoader (*.java) identifies resource loaders for handling JavaScript files in the resources servlet. No need to create if existing file already defined. web.xml servlet mapping. No need to create if existing servlet mapping for appropriate servlet already specified. Project Properties - compiler Settings, Trinidad Runtime Library, and Trinidad Tag Library. No need to add if existing file inclusion types and libraries are already specified. Script Delivery Using <trh:script> - No need to add to page markup if already specified.

JSP Tag Library - adfdemo.tld

\ViewController\public_html\WEB-INF\adfdemo.tld (if project only JSP tag library)
<?xml version = '1.0' encoding = 'windows-1252'?> <taglib xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-jsptaglibrary_2_1.xsd" version="2.1" xmlns="http://java.sun.com/xml/ns/javaee"> <display-name>adfdemo</display-name> <tlib-version>1.0</tlib-version> <short-name>adfdemo</short-name> <uri>/webapp/adfdemo</uri> <tag> <description> </description> <name>closePopupDynamicRegionBehavior</name> <tag-class>oracle.adf.view.ClosePopupDynamicRegionBehaviorTag</tag-class> <body-content>JSP</body-content> <attribute> <name>popupId</name> <rtexprvalue>true</rtexprvalue> </attribute> <attribute> <name>method</name>

Embeding Regions inside PopUp Windows

Functional
<deferred-method> <method-signature>void myMethod(oracle.adf.view.rich.render.ClientEvent)</methodsignature> </deferred-method> </attribute> </tag> </taglib>

Custom Tag Behavior Class ClosePopupDynamicRegionBehaviorTag.java

\ViewController\src\oracle\adf\view\ClosePopupDynamicRegionBehaviorTag.java
package oracle.adf.view; import javax.el.MethodExpression; import javax.faces.component.UIComponent; import oracle.adf.view.rich.event.ClientListenerSet; import oracle.adfinternal.view.faces.taglib.behaviors.BehaviorTag; public class ClosePopupDynamicRegionBehaviorTag extends BehaviorTag { private String popupId = null; private Boolean immediate = false; private MethodExpression method = null; public ClosePopupDynamicRegionBehaviorTag() { } @Override protected String getBehavior(UIComponent uIComponent) { StringBuilder buff = new StringBuilder(); buff.append("new

Embeding Regions inside PopUp Windows

Functional
AdfDemoClosePopupDynamicRegionBehavior('").append(popupId).append("',") .append(immediate).append(")"); return buff.toString(); } public void setPopupId(String popupId) { this.popupId = popupId; } public String getPopupId() { return popupId; } public void setImmediate(Boolean immediate) { this.immediate = immediate; } public Boolean getImmediate() { return immediate; } public void setMethod(MethodExpression method) { this.method = method; } public MethodExpression getMethod() { return method; } protected void updateClientListenerSet(UIComponent component, ClientListenerSet cls)

Embeding Regions inside PopUp Windows

Functional
{ super.updateClientListenerSet(component, cls); if (method != null) { cls.addCustomServerListener("serverPopupClosed", method); } } }

Custom Tag Behavior JavaScript AdfDemoClosePopupDynamicRegionBehavior.js

\ViewController\src\oracle\adf\view\AdfDemoClosePopupDynamicRegionBehavior.js
function AdfDemoClosePopupDynamicRegionBehavior(popupId, immediate) { this.Init(popupId, immediate); } AdfObject.createSubclass(AdfDemoClosePopupDynamicRegionBehavior, AdfClientBehavior); AdfDemoClosePopupDynamicRegionBehavior.prototype.initialize = function(component) { component.addEventListener(AdfPopupClosedEvent.POPUP_CLOSED_EVENT_TYPE, this._handlePopupClosed, this); } AdfDemoClosePopupDynamicRegionBehavior.prototype._handlePopupClosed = function (event) { var source = event.getSource(); AdfAssert.assertPrototype(source, AdfRichPopup); var popupId = this._popupId; AdfAssert.assertString(popupId);

Embeding Regions inside PopUp Windows

Functional
var immediate = this._immediate; AdfAssert.assertBoolean(immediate); var params = {};

params['popupId'] = popupId; var type = "serverPopupClosed"; AdfCustomEvent.queue(source, type, params, immediate); } AdfDemoClosePopupDynamicRegionBehavior.prototype.Init = function (popupId, immediate) { AdfDemoClosePopupDynamicRegionBehavior.superclass.Init.call(this); AdfAssert.assert(popupId != null); this._popupId = popupId; this._immediate = immediate; }

Resources - adfdemo.resources
\ViewController\src\META-INF\servlets\resources\adfdemo.resources
oracle.adf.view.ResourceLoader

ResourceLoader - ResourceLoader.java
\ViewController\src\oracle\adf\view\ResourceLoader.java
package oracle.adf.view; import org.apache.myfaces.trinidad.resource.AggregatingResourceLoader; import org.apache.myfaces.trinidad.resource.ClassLoaderResourceLoader; import org.apache.myfaces.trinidad.resource.RegexResourceLoader; public class ResourceLoader

Embeding Regions inside PopUp Windows

Functional
extends RegexResourceLoader { public ResourceLoader() { register("(/.*\\.(jpg|gif|png|jpeg))", new ClassLoaderResourceLoader("META-INF")); register("(/.*all-adfdemo.js)", new AcmeScriptsResourceLoader("/adfdemo/all-adfdemo.js")); } public static class AcmeScriptsResourceLoader extends AggregatingResourceLoader { public AcmeScriptsResourceLoader(String scriptsURI) { super(scriptsURI, _LIBRARIES, new ClassLoaderResourceLoader()); this.setSeparator(AcmeScriptsResourceLoader._NEWLINE_SEPARATOR); } static private final String[] _LIBRARIES = { "oracle/adf/view/AdfDemoClosePopupDynamicRegionBehavior.js" }; static private final String _NEWLINE_SEPARATOR = "\n"; } }

web.xml Servlet Mapping

\ViewController\public_html\WEB-INF\web.xml Add web.xml servlet mapping for the resources servlet to the /adfdemo/ URL pattern.
<servlet-mapping> <servlet-name>resources</servlet-name> <url-pattern>/adfdemo/*</url-pattern>

Embeding Regions inside PopUp Windows

Functional
</servlet-mapping>

Project Properties
Add file inclusion types to project properties complier "Copy File Types to Output Directory" field for bundling in .resource and .js. The Trinidad Tag Library should be added to the project properties JSP Tag Libraries and the Trinidad Runtime Libraries to the Libraries and Classpath.

Script Delivery Using <trh:script>

Script delivery is only automatic for library components. Therefore, it should be accounted for within the page markup using <trh:script> as shown below. The file referenced by the source attribute is utilized by the script ResourceLoader.
<jsp:root mlns:trh=http://myfaces.apache.org/trinidad/html > <trh:head> <trh:script source="/adfdemo/all-adfdemo.js"/> </trh:head>

Known Issues
Automatic Partial Page Rendering: Automatic Partial Page Rendering for dynamic regions within <af:popups> is not supported by ADF Faces and ADF Controller. The "ChangeEventPolicy" attribute on the iterator bindings and value bindings should be set to 'none'. Instead, ADF Faces Partial Page Rendering can be used. For further information on ADF Faces Partial Page Rendering, refer to the "Oracle Fusion Middleware Web User Interface Developer's Guide for Oracle Application Development Framework 11g Release" Chapter 7 "Rendering Partial Page Content".

Embeding Regions inside PopUp Windows

Functional

Appendix Object Definitions Used by the Prototype

In order to test this pattern out, included is a JDeveloper 11g Application called PopupRegionSample.zip that can be unzipped into your designated work area and explored / executed from within JDeveloper 11g. Simply download PopupRegionSample.zip, unzip the archive, open the ADFPopupRegionSampleApplication.jws within JDeveloper 11g and explore. When using an Oracle Database version 10g or higher download the PopupRegionSample10.zip. This version utilizes the EMPLOYEES database table rather than the EMP database table. As of the Oracle Database version 10g, the EMP database table was removed. Note: This sample uses the HR schema that comes with the Oracle Database since version 9i. In some cases, you will need to unlock the HR account in the database.

Embeding Regions inside PopUp Windows