JavaScript

$e.execute Function

Syntax

$e.execute(element as HTMLElement|string, event as string)

Arguments

elementHTMLElementstring

An HTMLElement object or the ID of the element passed as a string.

eventstring

The event to execute. It can be one of the following. See "Executing Abstract Events" below for how to handle executing touch events.

click

When the user clicks on an element.

dblclick

When the user double clicks on an element.

mousedown

When the user presses the mouse down on an element.

mouseup

When the user releases the mouse button after pressing mouse down on an element.

mouseover

When the mouse cursor moves over an element.

mousemove

When the mouse cursor is being moved over an element.

mouseout

When the mouse cursor leaves an element.

keypress

When the user presses a key. Will fire repeatedly while the key is being pressed.

keydown

When the user presses a key. Fires on the key down.

keyup

When the user presses a key and then releases it.

focus

When the user gives focus to an element.

blur

When a user 'blurs' an element. I.e. when an element looses focus.

change

When the user makes a change in a form element.

reset

When the user resets the data in a form using a 'Reset' button.

submit

When the user clicks a form's 'Submit' button.

scroll

When the user scrolls a scrollable element. This could be the page itself, of a DIV that has scroll bars.

resize

When the user resizes the browser window.

load

When the page is loaded.

unload

When the page is unloaded (i.e. when you navigate to another page, or the browser is closed).

Description

Executes an event for an HTML element, such as a TextBox, Button, or DropdownBox control.

Discussion

The $e.execute() function allows you to trigger the event for an element, such as the keypress event for a Textbox.

var id = 'submitButton';
$e.execute(id,'click');

If the event to execute is for a control in the UX Component, you can get a pointer to the element using the {dialog.object}.getPointer() method. The pointer can then be passed to the $e.execute() function to trigger an event:

var ele = {dialog.object}.getPointer('DropDownBox_1');
if (ele) {
    $e.execute(ele,'blur');
}

Executing Abstract Events 

When working with controls in Alpha Anywhere, many controls offer two sets of events, traditional Javascript events for mouse and keyboard events and Javascript - (Touch, Mouse, Pointer Events) which support touch events in touch-enabled environments. The mouse and keyboard events can be passed directly to $e.execute():

// get a pointer to the UX textbox control
var ele = {dialog.object}.getPointer('TEXTBOX_1');
$e.execute(ele,'keyup');

The Javascript - (Touch, Mouse, Pointer Events), however, are abstract events that are dynamically resolved to native events based on whether or not the environment is touch-enabled. For example, move will resolve to "touchmove" on a mobile device and "mousemove" on a desktop computer. If you are developing a mobile web application that will support both environments and need to programmatically execute an abstract event, you need to specify the correct event for the environment when using $e.execute(). This can be done using the A5.d.evnts object.

A5.d.evnts is an object that maps abstract events to the event that will be triggered in the application's environment. Instead of trying to determine if the application is running on a mobile device yourself, the a5.d.evnts object can be used to specify the event for $e.execute() for the abstract events listed below:

Abstract Event
Example Using A5.d.evnts
click

$e.execute(ele, A5.d.evnts.click)

down

$e.execute(ele, A5.d.evnts.down)

up

$e.execute(ele, A5.d.evnts.up)

move

$e.execute(ele, A5.d.evnts.move)

dblClick

$e.execute(ele, A5.d.evnts.dblClick)

With A5.d.evnts, your code to trigger an abstract events, such as "move", simplifies to the following:

// Get a pointer to the text box:
var ele = {dialog.object}.getPointer('TEXTBOX_1');

// trigger an abstract move event:
$e.execute(ele,A5.d.evnts.move);

Not all Javascript - (Touch, Mouse, Pointer Events) events can be triggered programmatically due to their underlying implementation. For example, the swipe events do not have a native event in any environment. Rather, these events have been created to make it easier for developers to build behaviors around these actions. In the situation where no abstract event is available, you will need to place the code you would like to execute into a function that can be called from both the event and anywhere you need to programmatically execute the function.

Use {dialog.object}.getPointer() to get the DOM element for a control.

See Also