Retrieve a Contact List

Follow Along with Trail Together

Want to follow along with an expert as you work through this step? Take a look at this video, part of the Trail Together series.

(This clip starts at the 8:00 minute mark, in case you want to rewind and watch the beginning of the step again.)

Retrieve the Contacts

Now add an event handler that calls a JavaScript function to retrieve data from Salesforce.

1. In the Developer Console, click the MyContactList.cmp tab.
2. In the button panel on the right, click Controller.
3. In the body of the myAction JavaScript function, add the following code, beginning on a new line:

   var action = component.get("c.getContacts");
   action.setParams({
       recordId: component.get("v.recordId")
   });
   action.setCallback(this, function(data) {
       component.set("v.Contacts", data.getReturnValue());
   });
   $A.enqueueAction(action);
   

   The JavaScript function calls the getContacts method of the Apex controller that you created earlier, passing the recordId of the current Account. It then populates the attribute named Contacts with the results.
4. Select File | Save.
5. Click the MyContactList.cmp tab and add the following markup below the last aura:attributetag:

   <aura:handler name="init" value="{!this}" action="{!c.myAction}" />
   

   An aura:handler listens for a specific event and then executes the function identified by the action attribute in the component's controller file. The name attribute identifies the event, in this case init which is the event that fires as the component is loaded onto the page.
6. Select File | Save.