Tag: Winter 19

Multiple Sections with lightning:accordion

In this blog, I am going to show how to open Multiple Sections with lightning: accordion with winter 19 enhancement. An earlier version of the accordion doesn’t allow more than one content panel to be open at the same time, and it takes a lot of effort to do that to do that by using jquery or other javascript libraries. Now with allowMultipleSectionsOpen attribute on the accordion, you can able to open multiple sections of the accordion at the same time. By default, only one accordion section is expanded at a time.

Apex Class

The below simple class will fetch all the accounts and its contacts. In this example, we will be displaying account and its contacts as an accordion section.

Lightning Component

The below component will be displayed in the accordion with multiple sections capability.

Controller 

Code Highlights  

  1. The below attribute is to hold the account object and its contacts

2. The below Aura init handler to get the data from the server and set to the account list attribute

3. The below line shows the accordion to open multiple sections of the accordion at the same time by setting an allowMultipleSectionsOpen attribute to true.

4. Iteration all the collection to show the accordion sections.

5 . the below line is to create an accordion section.

The below image shows the multiple sections of the accordion at the same time

EmpJs Streaming API

Introduction 

Salesforce introduced a new component lightning:empApi  with winter 19 to support streaming API. Prior to winter 19 in order to use the streaming API, we need to upload the CometD javascript libraries to the static resource and we need to use cometD by using ltng:require along with afterscriptsloaded . But with the new EmpJs Streaming API library which subscribes to a streaming channel and listens to event messages using a shared CometD connection without using the CometD static resource. This component is supported only in desktop browsers. The lightning:empApi component provides access to methods for subscribing to a streaming channel         and listening to event messages. All streaming channels are supported, including channels for platform events, PushTopic events, generic events, and Change Data Capture events. The lightning:empApicomponent uses a shared CometD connection.

To call the component’s methods, add the lightning:empApi component inside your custom component and assign an aura:id attribute to it.

 

This example subscribes to a channel when you click the Subscribe button. The channel is specified in an input component. The default value provided is an example platform event channel. Replace the value with the desired channel name. A callback function on the subscribe() call prints the payload of each received event to the console. To view the event messages, enable your browser console view. The Unsubscribe button lets you stop the subscription and stop receiving event notifications.Add the following client-side controller functions. They are called by the Subscribe and Unsubscribe buttons. Each controller function calls the corresponding subscribe or unsubscribe method on the empApi component.

Step 1: Create a Pust topic

create a simple push topic as shown below the workbench.

Step 2: Use Emp Api in your code

Here is the simple component

After saving the component you can enter the streaming channel name and click on subscribe.

After creating a case record you will see the notifications on the lightning page.