The Faces Client component event handlers allow you to define actions
for specific events from Faces Client components; event handlers allow you
to connect events from one Faces Client component to another Faces Client
component and some Faces Components. You can also connect a Faces Client event
to an HTML control or to any other custom logic that you may have in JavaScriptâ„¢.
Note: Some Faces Client Components and Client
Data have been deprecated and are not recommended for use.
The following
have been deprecated and are not recommended for use:
- Client Data and its associated tooling (such as the Client Data view)
- Faces Client Components
- <odc:dataGrid> (Data Grid)
- <odc:webService> (Web Service)
- <odc:clientData>
- <odc:clientBinder>
For example, assume that a Data Tree is used to display an organization,
and each node of the data tree is a different department. Each department
is a client data object, and the department name is an attribute. The name
of each department is displayed as the nodes of the data tree. The client
data object is created with a data grid and contains the names of the employees
in a particular department. When a different department is highlighted in
the data tree, that department is used as the root object for the data grid,
which is refreshed to the show the employees of that department. Event handlers,
defined in the Quick Edit view, allow for this interaction.
Note: Once an event handler has been selected, JavaScriptâ„¢ code must be entered
in the right-hand pane of the Quick Edit view. This code will be the actions
performed when an event, such as onhighlight, is called.
The following list includes Faces Client events that may appear in the
left pane of the Quick Edit view for a particular Faces Client Component.
Data Tree
- onhighlight
- The onhighlight event is supported by the Data Grid
and Data Tree components. It is fired when a row in the data grid or node
in the data tree is highlighted or clicked on by the user. The event object
has two properties
- eobject - the object mapped to the highlighted row
or node, for example, the department
- propertyName - the name of the object property that
the user clicked, for example, the department name (applicable only for the
data tree).
- onselect / onunselect
- The onselect and onunselect events
are supported by the Data Grid and Data Tree components. These events are
fired when a user selects or deselects a check box for a node in the Data
Tree or a row in the Data Grid or selects or deselects a radio button for
a row in the Data Grid.
- eobject - the object mapped to the currently selected
or deselected row or node.
- checkedItemsArray - the list objects of the currently
selected rows or nodes, for example, the employee objects.
- onnodehighlight
- The onnodehighlight event is supported by the Data
Tree component. It is fired when any node in the data tree is highlighted
by the user. If a particular node already has an event handler for its onhighlight event,
then that event handler will be called before this. The event object has two
properties
- eobject - the object mapped to the highlighted node,
for example, the department
- propertyName - the name of the object property that
the user clicked, for example, the department name.
- onnodeselect/onnodeunselect
- The onnodeselect and onnodeunselect events
are supported by the Data Tree component. These events are fired when any
node in the data tree is selected or deselected. If a particular node already
has an event handler for its onselect or onunselect event, then that event
handler will be called before calling this. The event object has two properties
- eobject - the object mapped to the currently selected
or deselected node.
- checkedItemsArray - the list objects of the currently
selected nodes, for example, the employee objects.
- onexpand
- This event is fired when a particular node in the Data Tree is expanded.
The event object has 3 properties.
- eobject - this is the object mapped to the node on
which the user clicked.
- openedItemsArray - this is an array containing the eobjects which
represent all the currently expanded nodes in the data tree.
- levels - this is an integer indicating the number
of levels being expanded. If the value is -1, then all the nodes under the
current node being expanded will be expanded as well. If the value is the
1, then only the node that is clicked will be expanded.
- oncollapse
- This event is fired when a particular node in the Data Tree is collapsed.
The event object has 3 properties.
- eobject - this is the object mapped to the node on
which the user clicked.
- openedItemsArray - this is an array containing the eobjects which
represent all the currently expanded nodes in the data tree.
- levels - this is an integer indicating the number
of levels being collapsed. If the value is -1, then all the nodes under the
current node being collapsed will be collapsed as well. If the value is the
1, then only the node that is clicked will be collapsed.
- onnodeexpand
- This event is fired when any node in the Data Tree is expanded. If the
data tree node on which this event is fired already has a handler for its onexpand event,
then that will be called before the this handler. The event object has 3 properties.
- eobject - this is the object mapped to the node on
which the user clicked.
- openedItemsArray - this is an array containing the eobjects which
represent all the currently expanded nodes in the data tree.
- levels - this is an integer indicating the number
of levels being expanded. If the value is -1, then all the nodes under the
current node being expanded will be expanded as well. If the value is the
1, then only the node that is clicked will be expanded.
- onnodecollapse
- This event is fired when any node in the Data Tree is collapsed. If the
data tree node that is being collapsed already has a handler for its oncollapse event,
then that will be called before this handler. The event object has 3 properties.
- eobject - this is the object mapped to the node that
the user clicked on.
- openedItemsArray - this is an array containing the
eobjects which represent all the currently expanded nodes in the data tree.
- levels - this is an integer indicating the number
of levels being collapsed. If the value is -1, then all the nodes under the
current node being collapsed will be collapsed as well. If the value is the
1, then only the node that is clicked will be collapsed.
For more information on eObject, refer to Chapter 6: JavaScript Library
in FacesClient Components Developer's Guide.
Data Grid
- onhighlight
- The onhighlight event is supported by the Data Grid
and Data Tree components. It is fired when a row in the data grid or node
in the data tree is highlighted or clicked on by the user. The event object
has two properties
- eobject - the object mapped to the highlighted row
or node, for example, the department
- propertyName - the name of the object property that
the user clicked, for example, the department name (applicable only for the
data tree).
- onselect / onunselect
- The onselect and onunselect events
are supported by the Data Grid and Data Tree components. These events are
fired when a user selects or deselects a check box for a node in the Data
Tree or a row in the Data Grid or selects or deselects a radio button for
a row in the Data Grid.
- eobject - the object mapped to the currently selected
or deselected row or node.
- checkedItemsArray - the list objects of the currently
selected rows or nodes, for example, the employee objects.
- onnodeselect/onnodeunselect
- The onnodeselect and onnodeunselect events
are supported by the Data Grid and Data Tree components. These events are
fired when any node in the data tree is selected or deselected. If a particular
node already has an event handler for its onselect or onunselect event, then
that event handler will be called before calling this. The event object has
two properties
- eobject - the object mapped to the currently selected
or deselected node.
- checkedItemsArray - the list objects of the currently
selected nodes, for example, the employee objects.
- onfilter
- The onfilter event is fired when the Data Grid is filtering
out the data using the Row Filter expression in the Properties View of the
Data Grid supplied by the user. This event object has one property
- filterExpression - this is the JavaScript expression
that the user supplied to filter the data
- onpage
- The onpage event is fired when the user pages between
the different pages in the Data Grid. The event object has two properties.
- pageSelectChoice - the value of this property tells
the user whether he or she navigated to the next, previous, first, or last
page, or jumped to a particular page by specifying the page number. Accordingly,
the values for this property will be next, previous, first, last, or jump.
- pageStartIndex - the value of this property tells
you the index of the first item displayed on that page. For example, if the
user is displaying 5 items per page and jumps to the second page, then the
value for this property will be 6.
- onsort
- This event is fired when the user clicks on one of the columns in the
Data Grid to sort it. The event object has two properties.
- sortOrder - the value of this property tells the
user whether the sorting is ascending or descending. Accordingly, the values
for this property will be asc or desc.
- propertyName - the value of this property is the
name of the bean property that is used to display the value in the column
being sorted.
- onselectall
- This event is fired by the Data Grid when the user chooses to select all
the rows in the grid, but it is only fired on a Data Grid that has the selection
column. The event object has two properties.
- allEobjs - this is the array of all the objects currently
bound to the Data Grid. For example, if the Data Grid is displaying a list
of departments, then each item in the array will be a department object.
- toBeSelectEobjs - this is an array of objects in
the Data Grid that are going to be selected as a result of calling the select
all action.
- onunselectall
- This event is fired by the Data Grid when the user chooses to deselect
all the rows in the grid, but it is only fired on a Data Grid that has a selection
column. The event object has two properties.
- allEobjs - this is the array of all the objects currently
bound to the Data Grid. For example, if the Data Grid is displaying a list
of departments, then each item in the array will be a department object.
- toBeUnselectedEobjs - this is an array of objects
in the Data Grid that are going to be deselected as a result of calling the
deselect all action.
Note: If including string variables in your parameters for the handler
attribute, be sure that all quotes are properly escaped.