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.
For a demonstration of this feature, take a look at the events method sample app.
This section,
- Lists, page-wise, all the front-end events to which the app can react.
- Provides sample payloads that are passed to the callback methods, when the events occur.
- Describes the payload attributes.
Front-end events are of the following types: Click events, Change events, Intercept events.
Currently, for Freshsales Suite, only Change events are supported.
Change events
These events occur when a user changes the value of a field on the UI.
Note:User need not submit the modified value for the event listeners to pick up the event and execute the callback; merely changing the values is sufficient for the event trigger.
The event.helper.getData() method returns a JSON that contains the old and new values of the changed field.
Global event
| Event name | Event trigger |
|---|---|
| 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.
Contact details page events
| Event name | Event trigger |
|---|---|
| contact.update | When a user updates a contact. |
Deal details page events
| Event name | Event trigger |
|---|---|
| deal.update | When a user updates a deal. |
Sales account details page events
| Event name | Event trigger |
|---|---|
| account.update | When a user updates an account. |
Event and payload descriptions
contact.update
Use the sample code shown on the right pane > Sample code tab, to enable your app to react when a user updates a contact.
deal.update
Use the sample code shown on the right pane > Sample code tab, to enable your app to react when a user updates a deal.
account.update
Use the sample code shown on the right pane > Sample code tab, to enable your app to react when a user updates a sales account.