Posts

Showing posts from 2017

Displaying Toast Message from Modal in Lightning Components

-
Image
With traditional Visualforce development we use apex:pageMessage to display custom messages to the User. And now with Lightning Components development we can use force:showToast to display custom messages! Here we are going to display our Toast Messages from a Modal and expose it through a Lightning Component Tab. Below we are going to create our custom Lightning Component and Lightning Component custom Tab. LightningToastMsg.cmp: This is our component code <aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,force:lightningQuickActionWithoutHeader,force:hasRecordId" access="global"> <!--Load LDS from static resource--> <ltng:require styles="/resource/SLDS/assets/styles/salesforce-lightning-design-system.css"/> <!--Define Modal--> <div class="demo-only" style="height: 800px;"> <section role="dialog" tabindex="-1"...
Post a Comment
Read more

Using Aura:Set with Lightning Components Extension

-
Image
When we think about Object Oriented Concepts, Inheritance is one thing where we can extract functionality from Super Class and in Lightning Components development aura:set serves with similar feature where we can assign values for the attributes of a Super Component from a Sub Component which extends a Super Component. Resource Link: Lightning Components Developer Guide Below is a simple implementation of having two components and using aura:set we will populate attributes of a base component using another component which will extend our base component. Component 1: This will be our base component which will display records Name and Id which are passed from Component 2 using Aura:Set AuraSet1.cmp <!--AuraSet1--> <aura:component extensible="true" > <!--Load LDS from static resource--> <ltng:require styles="/resource/SLDS/assets/styles/salesforce-lightning-design-system.css"/> <aura:attribute name="rc...
2 comments
Read more

Salesforce Lightning Container Overview

-
Image
Earlier with Visualforce we have a way of exposing an external App using "iframe". Now with Lightning Component Development we have a similar functionality available with Lightning Container which hosts all external App content in an "iframe" which makes Lighting Container a powerful way of rendering external apps within our Lightning Components. In order to use external App within Lighting Container, we will just need to upload our App to a Static Resource and reference it under Lightning Container. Lightning Container in action: Lets go ahead and use a simple JavaScript App ( Source Link ) and save it under Static Resource and see how it is rendered when used in Lightning Container. Step 1: Copy paste below Code in a new text editor and save it as ".html" file. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Countries CRUD</title> <style> input[type='s...
Post a Comment
Read more

Lightning Data Service - Salesforce new Apex alternative - Part 2

-
Image
We have looked on some basic code for Loading and Updating a record using Lightning Design System in my last blog post. Here we are going to work on creating and deleting a record in Lightning Component using Lightning Design System. 1. Creating a Record: For creating a new record using LDS we declare force:recordData without assigning a recordId unlike what we use to do with Load and Update record. And then we load a record template by calling the getNewRecord function on force:recordData and finally we handle saving data using saveRecord in our 'handleSaveRecord' function. Lightning Components Developer guide already have some basic code on creating a Contact record ( Reference Link ). We are going to extend that code a bit to first create a new Account record and then create a new Contact record by linking it to the Account that we created all in one single shot. Below we are going to create a new Lighting Component from Developer Console by navigating to File...
31 comments
Read more

Lightning Data Service - Salesforce new Apex alternative - Part 1

-
Image
Lightning Data Service which is currently in Beta are Salesforce new alternative of using Apex in Lightning Components. Basically we can perform View, Save, Update, and Delete of any sObject record in Lightning Components without using Apex Code! Lightning Data Service also respect org sharing rules and FLS settings, records that are loaded in LDS are cached and shared across components and components accessing same record see significant performance change, since the record is loaded only once and it doesn't matter how many components are using it. When one component updates a record, the other component using it are notified and refresh it automatically. Resource Link: Lightning Data Service Lets have a look at how Lightning Data Service works in Lightning Components. 1. Loading a Record: This is the foremost simplest that we can do using LDS. Here force:recordData tag is what we use in our component and that is the key for our component to load record. Every force:...
Post a Comment
Read more

Salesforce Platform Events a plus to Integration Technique

-
Image
Platform Events are new Salesforce publish-subscribe modal available from Summer '17 release. Salesforce platform is already powerful having Outbound Messaging, REST API, and Streaming API available and with this new Platform Events it makes it even better and reduces need of having point-to-point integrations. Resource Links: 1. Platform Events Developer Guide Link 2. Here is an awesome blog post Link from Christopher Marzilli with detailed explanation about Platform Events Lets see how platform events work with a small implementation: Step 1: In Lightning experience Platform Events can be accessed using Setup-->Data-->Platform Events and here we are going to create a custom Text_Message platform event which is very similar on how we create custom objects, the only difference that we see in the API name is that all platform events end with '__e'. Also I have two custom fields (Message_Id__c, and Message_Type__c) to process message related call. Pub...
Post a Comment
Read more

Summer ’17 Salesforce Two New Cool Lightning Features

-
Image
With new Summer '17 release Salesforce introduced some new cool features for Lightning, I really liked below two features and they are my top pick for this blog posting 1. Standard Action Overrides 2. Lightning Data Service (Currently in Beta) Here is the Link for the article from Salesforce that has detailed explanation on each of these new features . Standard Action Overrides: Until Summer '17 release we only had an option to override standard actions with visualforce page but now we have an new option to override any of these four standard actions (New, View, Edit and Tab) with a custom lightning component, just by using one powerful line of code "lightning:actionOverride" . Lets just create a sample Lightning Component to override Account standard actions. Below is my Lightning Component Code: <aura:component implements="lightning:actionOverride,force:hasSObjectName,force:hasRecordId"> <aura:if isTrue="{!v.sObjectName...
Post a Comment
Read more

Lightning Component for Hours of Operation

-
Image
Often we have a business use case from sales users to be able to capture Hours of Operation from their customers. Here we are going to build a reusable Lightning Component that we can place on any Object (Standard or Custom) detail page . Below are Code blocks that assembles to form our Lightning Component! Controller Class: Note** Just make sure to create a custom field with Api "Hours__c" on any sObject that you want to place this Component and update Hours. public class HoursOfOperation { @AuraEnabled public static String getUpdtHrs(String sObjName, String sObjId, String hrs) { try { //query string to pull specific record to update hours String qry = 'Select Id, Name, Hours__c From ' + sObjName + ' Where Id=\'' + sObjId +'\'' + ' Limit 1'; List<sObject> lstRcds = Database.query(qry); //check if above query returns atleast one record if (lstRcd...
Post a Comment
Read more

Lightning Component to display dynamic sObject data

-
Image
Here in this blog, we are going to build a Lightning Component to display some standard field's data (Like Id, Name, CreatedByName, etc.,) for any given sObject that we are going to dynamically retrieve based upon record detail page on which our Lightning Component is placed! First we create a Class with a method to fetch records using sObject Name..... Below is the Controller Class to return sObject rows: 1: public class DynamicSObjectResults { 2: @AuraEnabled 3: public static List<Object> getObjRslts(String objName) { 4: String qry = 'Select Id, Name, CreatedBy.Name From ' + objName + ' Limit 6'; 5: List<Object> lstRcds = Database.query(qry); 6: return lstRcds; 7: } 8: } Now we create our Component and Component Controller Below is the Component Code: 1: <aura:component controller="DynamicSObjectResults" implements="force:hasRecordId,force:hasSObjectName,flexipage:availableForAl...
Post a Comment
Read more

Aura Supported Attributes- Part 2

-
Image
We looked at some basic attribute types in my last post . Now lets look at other attribute types that are available for Lightning Components development Object Types: This attribute type is declared as a type 'Object' and used for passing any type of event parameter's like Array of String, Array of Integer, etc.,           Object Type Attribute: <aura:attribute name="objTypeAttr" type="Object" default="['Test1', 'Test2']" /> Standard and Custom Object Types: This extends above attribute types in order to be able to use both Standard and Custom Objects           Standard Object Attribute: <aura:attribute name="standObj" type="Account" />           Custom Object Attribute: <aura:attribute name="cstmObj" type="Expense__c" /> Collection Types: We have Four collection attribute types for use [Type[], List, Set, and Map] Custom Apex Class Type...
Post a Comment
Read more

Aura Supported Attributes- Part 1

-
Image
Aura Attributes play an important role in holding Data when working with Lighting Component development and here I am going to play with some Aura Attributes that support different Types Lightning Components Developer Guide  has in depth explanation about these attributes Basic declaration of an aura attribute is ' <aura:attribute name="Test" type="String"/>'  here both 'name' and 'type' are required parameter's for an attribute with optional parameter's as 'access', 'default', 'required', and 'description' For any given attribute we can declare its Type as one of the following a. Basic Types b. Object Types c. Standard and Custom Object Types d. Collection Types e. Custom Apex Class Types f. Framework-Specific Types Lets put some Basic attribute types into action using a simple Lightning Component..... From Developer Console navigate to File-->New-->Lightning Component and ...
Post a Comment
Read more