A Client Event navigation logic element lets you send parameters from an Interact client (or the wrapping application) by generating an asynchronous event in the Interaction. The actions triggered by the event can be defined either in the Interaction itself, or in the JavaScript of the containing page of the Interaction. The actions are generally used to determine the direction in which the Interaction progresses. 

Some examples for using Client Events in Interactions are:

  • Each time the user reaches a specific step in the Interaction, a Client Event can open a relevant Help page in a portlet in the hosting web page.
  • A Client Event can redirect the user to a different webpage (e.g., to schedule a technician), or even to another website.

Note: Client events are not supported in the Mobile Web application.

Creating a Client Event Element
Creating a Client Event involves specifying a name for the event, and then defining action parameters (if relevant). 

To define a Client Event element:

  1. From the Interaction map, right-click and select Add a Step or hover over the relevant page, and select Navigation Logic > Client Event.



    The Client Event editor opens.

  2. In the Client Event Element Name field, enter a name for the element.
  3. In the Event Name field, enter a name for the event.
  4. If relevant, add an action parameter:
    a. At the right side of the Client Event editor, click
        A row is added to the Parameters frame.


    b. In the Parameter Name field, enter a unique name for the parameter. Then, in the field to the right, specify the parameter's value. You can either type a hard coded value, or enter @ and select a variable from the Variables list.
    In the following example, a hard coded URL path is set for the value of the image.

  5. To add another action parameter, repeat Step 4.
  6. At the lower right corner of the screen, click Create Event.
    The Client Event element is configured. When the Interaction is run in the Designer's simulator, a popup message is displayed to indicate that the event was fired. For example:

  7. Add the required JavaScript to the hosting page of the Interaction. For an example, refer to Client Event Flow Example (below).

Client Event Flow Example
This example presents a sample Interaction that uses Client Event elements. The Interaction is embedded in a website, as shown below:


The following sections describe the Interaction flow, and explain how the Client Event integration is done.

Step 1: Entering an Identifier

In this input question, users are asked to enter a customer ID.

Step 2: Checking the Identifier

In this step, a Decision checks the input, and sends the user to one of two Client Events, based on the ID received.

Step 3: Implementing Actions Based on the Client Event

At this point, an action takes place according to the event that is fired:

  • When the Outage event is fired, users are redirected to the Jacada website (www.jacada.com), and the Interaction ends.
  • When the setImage event is fired, the image in the header of the webpage is replaced with the Jacada logo, and the Interaction continues with Paragraph1.

 

The relevant Javascript added to the container page is shown below. The image set by the setImage function is defined in the action parameter of the setProduct Client Event element (refer to Step 4b in the procedure above). 

Revision:

Comments