Front-end events are actions on the product UI, such as button clicks and changes/updates to the UI field values. Events method is an interface that the developer platform provides, to enable your app to react to front-end events.
To enable your app to react to front-end events, in the app.js file,
- Subscribe to the app.initialized event, through an event listener. When the app is initialized, the parent application passes a client reference to the app.
- After app initialization,
- Use the client reference, subscribe to <Event name> and register a callback method to be executed when the event occurs.
- Define the callback method.
When the event occurs, a payload is passed to the callback method. Let us call this payload event. event.type returns the name of the event. The event.helper.getData() helper method returns a JSON object that contains information pertaining to the event. Your app logic can process this data into meaningful results.
Front-end events are of the following types: Click events, Change events, Intercept events.
Currently, for the common module app, only one click event (calling or cti.triggerDialer - depending on the other non-common module added in the manifest) is supported.
Notes:- When building a common module app, you must specify at least one other module in the app manifest. The other module(s) specified determine the product where the common module app is deployed.
- If the only other non-common modules included in the app manifest are any modules other than those in the following table, you cannot use the events method in your app logic.
| If the other module is… | If the app is intended to be deployed on… | The click event that can be used in the app logic is… | Event trigger |
|---|---|---|---|
support_email support_ticket support_portal support_agent support_contact support_company | Freshdesk at the cti_global_sidebar placeholder | When a user clicks the call icon or phone number link that is displayed on any of the following pages of the product UI:
| |
appointment contact cpq_document deal phone product sales_account task | Freshsales Classic or Freshsales Suite at the left_nav_cti placeholder | When a user clicks the call icon or phone number link that is displayed on any of the following pages of the product UI:
| |
| lead | Freshsales Classic at the left_nav_cti placeholder | calling | When a user clicks the call icon or phone number link that is displayed on any of the following pages of the product UI:
|
calling
Use the sample code shown on the right pane > Sample code tab, to enable your app to react to user clicks such as the click on a call icon or phone number, on the UI.
cti.triggerDialer
Use the sample code shown on the right pane > Sample code tab, to enable your app to react to user clicks such as the click on a call icon or phone number, on the UI.