Friday 28 December 2012

13. Implementing Shuttle Region in OAF

Shuttle region allows users to move items between two lists as well as reorder the items in the list. When you implement a Shuttle region, you define two lists:

A Leading list (Available List) - from which user can select items from a given list of items
A Trailing list (Selected List) - user will select item from Leading list and move those to this trailing list.

Also we can implement a Shuttle region with just one list, to achieve only Reorder functionality, in that case only a Leading list is required.

We can also add buttons/icons in the footer below each of the Shuttle lists. By Simply defining Leading footer child or Trailing footer child in region creates a flowLayout region by default, to which we can add a button or image.

Here, I have created a simple page to implement shuttle region. User will select employee name from 'Available List' and move them to 'selected List'. A button is also added at footer of trailing list. Clicking on this button will show all the employees selected in a message.

1) Create a new OA page:
=========================
Right click on project (xxcus) --> New --> Web Tier --> OA Components --> select 'Page' item. Click OK. (This will open a popup window)
We are creating a page for implementing shuttle region, so specify the details of page as below:
          Name: XxShuttleDemoPG
          Package: xxcus.oracle.apps.fnd.shuttledemo.webui

2) Create a new view objects (VO):
=========================
Right click --> New View Object (This will open a wizard having 7 steps).

Step 1
         Package: xxcus.oracle.apps.fnd.shuttledemo.server
         Name: XxEmpShuttleVO
         Choose the radio button 'Read-only Access' (as there is no DML operation). Click Next.

Step 2
         Enter the below query in 'Query Statement':
               select ename from employee

Keep defaults for step3, 4, 5, 6 & 7 and click Finish. Save All.  

3) Create a new Application Module (AM):
=========================

Step 1
         Package: xxcus.oracle.apps.fnd.shuttledemo.server
         Name: XxShuttleDemoAM. Click Next.

Step 2
    Here we will add an instance of the VO created in (2). Select XxEmpShuttleVO from 'Available View Objects' and shuttle it to 'Data Model' using ">" button.

Keep defaults for all other steps (3, 4). Click Finish.

4) Create a new Controller (CO):
=========================
Right click on pageLayout region and create a new controller
            Name: XxShuttleDemoCO
            package: xxcus.oracle.apps.fnd.shuttledemo.webui


5) Creating the Page Layout & Setting its Properties :-
==========================
The page will appear as below:



1) Create a new region under pageLayout of type shuttle. This will automatically create a region for leading list.
2) Add Trailing list: right click shuttle region --> new --> Trailing.
3) Add trailing footer to display button: Again right click on shuttle region --> new --> trailingFooter. This will create a flowLayout region under trailingFooter.
4) Add 'Display Items' button: Create an item of type submitButton under the flowLayout region.

Now change the properties for each field from property inspector as shown below:


pageLayout:
            ID: pageLayoutRN
            AM Definition: xxcus.oracle.apps.fnd.shuttledemo.server.XxShuttleDemoAM
            Window Title: Shuttle Demo Page
            Title: Shuttle Demo

shuttle:
           ID: shuttleRN
           Available Header: Available Employees
           Selected Header: Selected Employees


leadingList:
           Picklist View Definition: xxcus.oracle.apps.fnd.shuttledemo.server.XxEmpShuttleVO
           Picklist View Instance: XxEmpShuttleVO1
           Picklist Display Attribute: Ename
           Picklist Value Attribute: Ename

list2:
           Picklist Display Attribute: Ename
           Picklist Value Attribute: Ename

submitButton:
           ID: displayBtn
           Prompt: Display Items

The declarative page structure in jDev will be similar to as shown below:


We will catch the button event (displayBtn) in PFR method of controller and display a message showing all the employees present in selected list. If there is no item in selected list, throw an error message. Below is code for the same:
public void processFormRequest(OAPageContext pageContext, 
                               OAWebBean webBean) {
    super.processFormRequest(pageContext, webBean);
    
	String message = "";
    
	if (pageContext.getParameter("displayBtn") != null) {
        OADefaultShuttleBean shuttle = 
            (OADefaultShuttleBean)webBean.findChildRecursive("shuttleRN");
        String[] items = 
            shuttle.getTrailingListOptionValues(pageContext, shuttle);
    
    if (items != null) {
            for (int i = 0; i < items.length - 1; i++) {
                message = items[i] + " , " + message;
            }
            
			message = message + items[items.length - 1];            
            throw new OAException("Items in trailing list are: " + 
                                  message, OAException.INFORMATION);
        } else {
       throw new OAException("Please shuttle at least one item from available list.", 
                                  OAException.ERROR);
        }
    }
}

Below is how the error message will appear:








4 comments:

  1. Very helpful Sushant - thank you!

    ReplyDelete
  2. Can you please tell how to implement a Search Functionality on the LeadingList.

    Thanks & Regards,
    Gaurav

    ReplyDelete
  3. Hi Sushant,

    Great article, I am facing the below error when trying this:

    oracle.apps.fnd.framework.OAException: oracle.jbo.InvalidObjNameException: JBO-25005: Object name for type View Object is invalid

    Based on the exception. I thought I missed to give the details for the Picklist properties, but all are given and referring to correct VO.

    Can you please help me here

    ReplyDelete