Most of these tasks are accomplished
with Oracle JDeveloper’s declarative and
visual tools or with a few changes to
configuration files, as detailed in the
remainder of this column.
ENABLING BASIC DRAG-AND-DROP
FUNC TIONALI T Y
To enable panelBox components to be
moved within the panelDashboard com-
ponent, the panelBox must be marked as
a drag source. You can do this declaratively
in Oracle JDeveloper by simply adding
to each panelBox the necessary tag—an
af:componentDragSource tag in this case.
The af:componentDragSource tag is an
Oracle ADF Faces behavior tag that encap-
otherwise have to write) for implementing
drag-and-drop in HTML pages. Behavior
Figure 4: Editing the MDS customization layer for the User CC class
Figure 5: MDS configuration for panelDashboard in adf-config.xml
tags are just one example of how Oracle ADF
Faces improves developer productivity by
providing functionality that typically would
require custom code.
To mark the panel boxes as drag sources,
you drag the componentDragSource tag
from the Component Palette and drop it onto
each of the panelBox objects of the application. This gesture (dragging items from the
Component Palette onto a page) is easy to do
in the Structure window:
1. From the Oracle JDeveloper menu, select
View -> Structure to open the Structure
window, and select View -> Component
Palette to open the Component Palette.
2. In the Application Navigator, double-click
the DashBoardPage.jspx file to launch
the Oracle JDeveloper visual editor.
3. In the opened editor, click in one of the
panel boxes, such as the “Employee
Salaries in selected Department” box.
In the Structure window, you should see
the af: panelDashboard component and its
contained af:panelBox children. Now move
to the Component Palette:
1. Select ADF Faces from the menu.
2. In the search field above the menu, type
component drag source and press
Enter (or click the right-arrow search
button). The search results return the
Component Drag Source (ADF Faces
3. Drag the Component Drag Source tag
from the Component Palette to the
af:panelDashboard, and drop it onto the
first af:panelBox child component in the
Repeat this process for the other three
panel boxes in the dashboard. When
you finish, every panel box will have an
af:componentDragSource as a child component (see Figure 2).
Right-click DashBoardPage.jspx, and
select Run from the context menu to run
the sample application again. When the
application appears in the browser, select a
panel box and move it within the dashboard,
as shown in Figure 3. When you release the
mouse button, Oracle ADF Faces will drop
the panel box into position.
Nice! But we’re not done yet. If the user
quits the application at this point, the
changes to the UI won’t be retained. To