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:
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:
Available Header: Available Employees
Selected Header: Selected Employees
list2:
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:
Below is how the error message will appear:
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:
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: shuttleRNAvailable 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
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:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
| 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:
