---
title: Event Listeners
description: >-
  Based on the respondent's interaction with our surveys you can trigger actions
  in your app or website, or even build custom integrations.
source_url:
  html: 'https://developers.survicate.com/javascript/events/'
  md: 'https://developers.survicate.com/javascript/events.md'
---
# Events
Based on the respondent's interaction with our surveys you can trigger actions in your app or website, or even build custom integrations. You can set up listeners to hook into user interactions with our surveys.

Event listeners can only be used on some of the paid plans. Check [our pricing page](https://survicate.com/pricing/#pricing-compare-plans) for more details. We refer to this feature as 'Advanced Targeting' or 'JavaScript Targeting'.

```javascript title="Manual implementation"
const listenerId = _sva.addEventListener('event', callback);
```

```javascript title="Web package"
const listenerId = Survicate.addEventListener('event', callback);
```

```javascript title="Web surveys wrapper"
const listenerId = survicate.addEventListener('event', callback);
```

By calling the `addEventListener` method multiple times, you can set up more than one listener for a given event.

If you don't need the listener anymore, you can use `removeEventListener` method to remove the previously registered listener. It is possible to remove either all the listeners that are hooked into a given event or a single listener based on the `listenerId` returned from the `addEventListener` method.

```javascript title="Manual implementation"
// Remove an event listener based on its id
_sva.removeEventListener(listenerId);

// Remove all listeners hooked into a given event
_sva.removeEventListener('question_answered');
```

```javascript title="Web package"
// Remove an event listener based on its id
Survicate.removeEventListener(listenerId);

// Remove all listeners hooked into a given event
Survicate.removeEventListener(Survicate.ApiEvent.questionAnswered);
```

```javascript title="Web surveys wrapper"
// Remove an event listener based on its id
survicate.removeEventListener(listenerId);

// Remove all listeners hooked into a given event
survicate.removeEventListener(ApiEvent.questionAnswered);
```

***Please note***: All events are emitted asynchronously - we cannot guarantee that the event has already been reflected in Survicate at the time of the emission. For instance, an answer for a certain question might not be present in Survicate yet.

---

## Survey displayed

Every display of a survey is followed by the `survey_displayed` event emission.

```javascript title="Manual implementation"
_sva.addEventListener('survey_displayed', function(surveyId, surveyName) {
  // do stuff
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.surveyDisplayed, function(surveyId, surveyName) {
  // do stuff
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.surveyDisplayed, function(surveyI, surveyName) {
  // do stuff
});
```

---

## Question answered

As soon as the visitor answers a question, Survicate emits the `question_answered` event.

```javascript title="Manual implementation"
_sva.addEventListener('question_answered', function(surveyId, questionId, answer) {
  // do stuff
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  // do stuff
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  // do stuff
});
```

#### Example 1: Set a cookie after response to specific question

```javascript title="Manual implementation"
_sva.addEventListener('question_answered', function(surveyId, questionId, answer) {
  if (questionId == 2836357) { // Question ID can be retrieved with Survicate Data Export API
    document.cookie = "surveyAnswered=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
  }
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  if (questionId == 2836352) { // Question ID can be retrieved with Survicate Data Export API
    document.cookie = "surveyAnswered=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
  }
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  if (questionId == 2836357) { // Question ID can be retrieved with Survicate Data Export API
    document.cookie = "surveyAnswered=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
  }
});
```

#### Example 2: Open Intercom messenger after response to specific question

```javascript title="Manual implementation"
_sva.addEventListener('question_answered', function(surveyId, questionId, answer) {
  if (questionId == 2836357) { // Question ID can be retrieved with Survicate Data Export API
    Intercom('showNewMessage', 'pre-populated content'); //replace pre-populated content with your content
  }
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  if (questionId == 2836357) { // Question ID can be retrieved with Survicate Data Export API
    Intercom('showNewMessage', 'pre-populated content'); //replace pre-populated content with your content
  }
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.questionAnswered, function(surveyId, questionId, answer) {
  if (questionId == 2836357) { // Question ID can be retrieved with Survicate Data Export API
    Intercom('showNewMessage', 'pre-populated content'); //replace pre-populated content with your content
  }
});
```

### Answer object properties

| Property     | Type      | Description                                                                                    |   |   |
| ------------ | --------- | ---------------------------------------------------------------------------------------------- |---|---|
| answer_type  | string    | Answer type.                                                                                   |   |   |
| answer_id    | integer   | Answer ID. **Applicable only for type  = ['single', 'smiley_scale', 'dropdown_list'].**        |   |   |
| answer_ids   | integer[] | Array of answer IDs. **Applicable only for type = ['multiple'].**                             |   |   |
| answer_value | string    | Context value of the answer. **Applicable only for type = ['text', 'nps', 'date', 'rating'].** |   |   |

***Please note***: At the moment we support passing the `answer_id`, `answer_ids` and `answer_value` properties only for the cases enlisted in the table above. Therefore, expect that there might be answer objects that consist only of the `answer_type` property.

---

## Survey completed

Once a survey has been completed, Survicate emits the `survey_completed` event. Survey is considered to be completed, when a visitor has answered every single question that was displayed to them in the configured flow.

```javascript title="Manual implementation"
_sva.addEventListener('survey_completed', function(surveyId) {
  // Trigger any action that works with your workflow
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.surveyCompleted, function(surveyId) {
  // Trigger any action that works with your workflow
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.surveyCompleted, function(surveyId) {
// Trigger any action that works with your workflow
});
```

---

## Survey closed

If at any stage of the survey, your visitor clicks the close button, Survicate will emit the `survey_closed` event.

```javascript title="Manual implementation"
_sva.addEventListener('survey_closed', function(surveyId) {
  // Trigger any action that works with your workflow
});
```

```javascript title="Web package"
Survicate.addEventListener(Survicate.ApiEvent.surveyClosed, function(surveyId) {
  // Trigger any action that works with your workflow
});
```

```javascript title="Web surveys wrapper"
survicate.addEventListener(ApiEvent.surveyClosed, function(surveyId) {
  // Trigger any action that works with your workflow
});
```

##  Script loaded
***Important to note:***
This refers only to the manual installation of Survicate script.

As soon as the Survicate script has been fully loaded and ready, you will be informed through the `SurvicateReady` window event. This event is especially useful for the Single Page Applications/Progressive Web Applications.

```javascript
window.addEventListener('SurvicateReady', function() {
  // Trigger any action that works with your workflow
});
```

#### Example: Reset visitor after script has been loaded

```javascript
window.addEventListener('SurvicateReady', function() {
  _sva.destroyVisitor(_sva.retarget);
});
```

***Please note***: Due to its nature, unlike the other events, the `SurvicateReady` event is attached to the window object and not the `_sva` object.