Saturday, April 29, 2017

[Salesforce / Lightning] Simple Custom Modal Alert

Hello everybody!

This is an "easy peasy" post that comes from a recent two-weeks full immersion on Lightning Components task I got into at work: there will be more content from this activity and a Cagliari DG presentation as well.

For all the TL;DR guys (and again, I'm one of you!), here is the Github Repository.

The Alert Modal shows an alert modal through a custom event fired from your Lightning components:

var evt = $A.get("e.c:AlertEvt");
        evt.setParams({
            "show": true,                     //shos alert
            "mode": 'prompt',                 //alert mode: prompt, alert, toast
            "fixed": false,                   //fixed does not shows any "close" button
            "type": 'info',                   //type of alert: info, success, warning, error
            "message": 'Title Message',       //main title
            "details": 'Message Details. . .' //details message
        });
        evt.fire();

The event is caught up by the AlertCmp Lightning component that shows the request alert:


Besides the prompt mode, you can use the alert mode:


And a toast mode:


You can test the component in the provided Lightning app: