DOM selection and manipulation in jQuery is essential for identifying web page components. Event handling facilitates interaction with these identified components by the end users by responding to their input devices.
Touch screens have turned the user’s fingers into input devices and events such as those responding to gestures are handled specifically with jQueryMobile—a framework for creating mobile applications. APEX applications don’t need to include the mobile framework to handle standard tap and scrolling events. A small library called Touch Punch can be included on a web page to make it respond to dragging gestures, useful for slider items.
If you’ve ever defined a dynamic action on change of an item, you have applied an event listener to your page. APEX provides the ability to define these events and subsequent actions declaratively.
To call a function as a result of an event on the page, define a listener for a given selector. The following example calls myFunction on a click (or touch) on the page component with id demo1:
(’#demo1’).on(’click’, myFunction);
Functions invoked like this are called callbacks and will have access to contextual event information. This information allows the code to make decisions based on the current state of the web page.
Other major event types include on load of the page, before/after refresh of report regions, and gesturing events similar to mouse interactions such as touchstart and touchend.
A proportion of PL/SQL developers will also be familiar with Oracle Forms - a development IDE now superseded by jDeveloper ADF and APEX. Web page events can draw further analogies to Oracle Forms events as mapped in Table 1.
Table 1. Forms Events and Their JavaScript Equivalent
Forms | JavaScript |
when-new-form-instance | load |
when-validate-item | change |
when-mouse-click when-button-pressed | click |
pre-query | beforerefresh |
when-mouse-down | touchstart |