---
schema_version: "1"
id: 607b7ccbdd959b6d498562bea222ec2cc7024a0d8439adecd5a75c4094959793
title: CRM Analytics Aura Events - SelectionChanged Event
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/analytics/bi_dev_guide_sdk/guides/bi-sdk-web-example2.md
canonical_url: https://developer.salesforce.com/docs/analytics/bi-dev-guide-sdk/guide/bi-sdk-web-example2.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 4088bbd30f7e3dbd894c2f9a460cf3672f25a286ca1a024a094171c0cccd1964
products:
  - Analytics SDK Developer Guide
  - analytics
---

# CRM Analytics Aura Events - SelectionChanged Event

React to selections in your dashboard and get the row data for the selection.

## Example - Reacting to a Selection with the selectionChanged Event

The dashboard component also generates Lightning events when the user changes a selection. The payload for these events is effectively the row data for the current selection. Datasets can be from many sources, so the actual payload may only be meaningful when the user has knowledge of the datasets being used. This example shows how to receive and iterate through the payload, which is an array of objects representing the current selection.

This example uses the same dashboard used for the update event example, so be sure to follow those steps first.

Using the Developer Console, create an Aura component named recordView. Copy the following markup into the component.

```nolang
<aura:component implements="force:appHostable,
                flexipage:availableForAllPageTypes,
                flexipage:availableForRecordHome,
                force:hasRecordId,
                forceCommunity:availableForAllPageTypes,
                force:lightningQuickAction"
                access="global" >
  <aura:handler event="wave:selectionChanged" action="{!c.handleSelectionChanged}"/>
  <aura:attribute name="msg" type="String" default="Please make a selection in CRM Analytics that contains a record ID" access="GLOBAL"/>
  <aura:attribute name="recordId" type="String" default="" access="GLOBAL"/>
  <aura:dependency resource="markup://force:navigateToSObject" type="EVENT"/>
  <div class="container">
    <aura:if isTrue="{!v.recordId == ''}">
      <div class="msg">
        {!v.msg}
      </div>
      <aura:set attribute="else">
        <force:recordView recordId="{!v.recordId}"/>
      </aura:set>
    </aura:if>
  </div>
</aura:component>
```

Add a Controller (recordViewController.js) to the bundle and copy the following JavaScript into it:

```nolang
({
  handleSelectionChanged: function(component, event, helper) {
    var params = event.getParams();
    var payload = params.payload;
    if (payload) {
      var step = payload.step;
      var data = payload.data;
      data.forEach(function(obj) {
        for (var k in obj) {
          if (k === 'Id') {
            component.set("v.recordId", obj[k]);
          }
        }
      });
    }
  }
})
```

This example references recordId, an Opportunity record identifier. If you don’t use this in your dashboard, substitute a different field.

Payload data can contain other objects, each in turn containing key-value pairs. For example, aside from the Id, you can also get the noun (for example, "dashboard") and the verb (for example, "selection").

Add a Style (recordView.css) to the bundle and copy the following CSS into it:

```nolang
.THIS.container {
  min-height: 650px;
  min-width: 200px;
  height: 100%;
  width: 100%;
  border: 1px solid #A0A0A0;
  margin: 5px auto;
}

.THIS .msg {
  vertical-align: middle;
  text-align: center;
  margin: 2em auto;
}
```

For a better experience in Lightning App Builder, add a Design (recordView.design) to the bundle and paste in the following:

```nolang
<design:component label="Record View">
  <design:attribute name="recordId" label="Record ID" description="ID of the record"/>
  <design:attribute name="msg" label="Message" description="Message to display"/>
</design:component>
```

The page you created using Lightning App Builder should now show the Record View component in the palette. Drag this component onto the page, then save the page.

Go back to Lightning Experience, and make a selection in your CRM Analytics Dashboard component. The corresponding Salesforce Opportunity record (or the record type you specified in recordViewController.js) will be displayed in the newly added component.

## Resources

For more information about Aura events and other Lightning development features, see the [Lightning Aura Components Developer Guide](https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/intro_framework.htm).