Lightning Component For Notification

15 Feb 2017

A custom notification component that can be used as generic notification for your application. It is a simple plug and play. Some of features are:

  1. It has major two notification types: bar, Popup
  2. It handles all types of information notificatons: ‘error, warning, success, info’
  3. It has ability to get redirected to another page in case of any confirm action.


Parameters available

Attribute Required? Description type Yes Type of notification — Default,Success,Warning,Offline,Error message Yes The message to be shown show Yes Set this to hide / show message notificaionType Optional type of notification to be shown i.e bar,popup. Default is bar. popupheader Optional The header to be shown for popup notification redirectUri Optional Url on which to be redirected once ‘OK’ button is clicked for popup notification.

Special methods

There are two methods that can be used within the lightining component’s JS controllers to display these notifications directly. 
 1. setNotification — for bar type 
 2. setPopup — for popup type

Parameters to be used in different scenarios

Alert bar

<c:Notification aura:id="notifyAlert" show="true" type="error" message="This is a sample alert error" />
<c:Notification aura:id="notifyPopup" show="true" type="Warning" message="Are you sure you want to redirect?" popupheader="Confirm" redirectUri=""/>

Calling through lightning’s JS Controller

<!-- html's code --> <c:Notification show="false" type="" message="" aura:id="notifyComp" /> <!-- controller's code --> <!-- set alert--> displayNotification : function(component, msg, type){ component.find("notifyComp").setNotification(true ,type ,msg ,"forever"); } <-- set popup--> displayPopup : function(component, type , header, message){ component.get("notifyComp").setPopup(true, type, header, message); }

To download all its code, you can install Lightning Utilities unmanaged package or you can also download it from Lightning-Utilities github repo.

Hope this helps. Happy coding!

Related Articles

Lightning Utilities — Salesforce

Lightning Component For Lookup — LookupSobject

Lightning Component For Spinner

Labels: Lightning, Salesforce, Utilities, Component

Originally published at on February 15, 2017.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.