Aura:if vs slds-show/hide : Which one to use for rendering html components in Lightning components

As we know that sometimes we have show content in Lightning components based on different conditions. There are 2 different options to achieve this:

• By using <Aura:if > tag.

For example :

<aura:if isTrue="{!v.displayedSection == 'section1'}">

<!-- code to display information on UI -->

</aura:if>

• By using slds-show or slds-hide class on div.

For example :

<div class="{!if(v.displayedSection == 'section1','slds-show','slds-hide')}">

<!-- code to display information on UI -->

</div>

Considerations while using <Aura:if> tag

• Only the code present inside Aura:if for which condition returns true will be rendered as HTML.
• If you try to refer HTML component in controller.js present inside Aura:if which is not visible on UI because condition specified doesn't match, then you will get undefined value.

I have created a Lightning component to show Aura:if behavior along with snapshot from inspect element and console log statements to justify above 2 statements.

Image snapshot showing behavior using inspect element:

Considerations while using slds-show or slds-hide class

• All code present inside the div will be rendered as HTML irrespective of div class. Only the div for which class is slds-hide will not be visible on UI.
• All HTML components can be referred in controller.js irrespective of class specified on div.

I have created a lightning component to display slds-show or slds-hide behavior along with snapshot from inspect element to justify above statements.

Image snapshot showing component behaviour using inspect element:

Hope this will help!!!

Looking forward for everyone's comments and suggestion.

More Blogs>>: 

INHERITANCE IN LIGHTNING    
FIRING EVENT FROM LIGHTNING COMPONENT AND PASSING IT TO VF PAGE    
CHANGES TO LIGHTNING DATA SERVICE IN SUMMER'17    
LIGHTNING DATA SERVICES    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
FIRE LIGHTNING EVENTS FROM VF PAGE    
DYNAMICALLY CREATING AND DESTROYING LIGHTNING COMPONENTS    
RAISING AND HANDLING CUSTOM EVENTS IN sALESFORCE lIGHTNING    
WHY TO USE DESIGN RESOURCE AND HOW TO ADD DYNAMIC OPTION TO DATASOURCE    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
PASSING INNER WRAPPER CLASS TO LIGHTNING COMPONENT    
LIGHTNING COMPONENT FOR RECORDTYPE SELECTION FOR ANY SOBJECT    
CUSTOM COMPONENT TO SHOW/HIDE SPINNER IMAGE    

Salesforce Communities

Initially Salesforce introduces many types of portals like partner portal, customer portal etc. Now these features are not available for new customers and Salesforce suggest to migrate to communities from existing portals because it is easy to implement and having more features.

Also all data access can be configured by Admin and even you can create different communities for your organization as per requirement as we normally do with WhatsApp groups or Facebook groups.

I have created presentation on Salesforce Communities and presented it in one of the Salesforce Meet up held in Pune, India.

Salesforce Communities from Sunil Kumar

Hope this will help in basic understanding of Salesforce Communities!!

More Blogs>>: 

INHERITANCE IN LIGHTNING    
FIRING EVENT FROM LIGHTNING COMPONENT AND PASSING IT TO VF PAGE    
CHANGES TO LIGHTNING DATA SERVICE IN SUMMER'17    
LIGHTNING DATA SERVICES    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
FIRE LIGHTNING EVENTS FROM VF PAGE    
DYNAMICALLY CREATING AND DESTROYING LIGHTNING COMPONENTS    
RAISING AND HANDLING CUSTOM EVENTS IN sALESFORCE lIGHTNING    
WHY TO USE DESIGN RESOURCE AND HOW TO ADD DYNAMIC OPTION TO DATASOURCE    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
PASSING INNER WRAPPER CLASS TO LIGHTNING COMPONENT    
LIGHTNING COMPONENT FOR RECORDTYPE SELECTION FOR ANY SOBJECT    
CUSTOM COMPONENT TO SHOW/HIDE SPINNER IMAGE    

Lightning Component to Display SetUp Audit Trail Data

As we know, SetUp Audit Trail allow us to track all the metadata changes happened to our org. Previously we have to download the SetUp Audit Trail history data from Salesforce UI in excel file.

SetUp audit trail data was not exposed in apex or through API in past but now salesforce has provided an option to query that data in apex or through API by introduction new object called "SetUpAuditTrail". This help us to find historical metadata changes specific to any action or any metadata changes done by any particular user.

I have created a lightning component which will display the SetUpAuditTrail data based on fileters provided by user. As of now, there is limited capability of sorting and filtering SetUpAuditTrail object records, I have used jquery datatable which will help us to sort records on all columns and also to filter records easily.

I have added the component to VF page by adding it to lightning app and exposed VF page through custom tab.

SetUpAuditTrail tracking VF page snapshot:

You can download complete code from below URL:
Lightning Component For SetUpAuditTrail Tracking

This is basic code for basic functionality. You can extend it as per your requirement.

Hope this will help!!!

Looking forward for everyone comments and suggestion!!

More Blogs>>: 

INHERITANCE IN LIGHTNING    
FIRING EVENT FROM LIGHTNING COMPONENT AND PASSING IT TO VF PAGE    
CHANGES TO LIGHTNING DATA SERVICE IN SUMMER'17    
LIGHTNING DATA SERVICES    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
FIRE LIGHTNING EVENTS FROM VF PAGE    
DYNAMICALLY CREATING AND DESTROYING LIGHTNING COMPONENTS    
RAISING AND HANDLING CUSTOM EVENTS IN sALESFORCE lIGHTNING    
WHY TO USE DESIGN RESOURCE AND HOW TO ADD DYNAMIC OPTION TO DATASOURCE    
PASSING LIGHTNING COMPONENT ATTRIBUTE VALUE FROM VF PAGE    
PASSING INNER WRAPPER CLASS TO LIGHTNING COMPONENT    
LIGHTNING COMPONENT FOR RECORDTYPE SELECTION FOR ANY SOBJECT    
CUSTOM COMPONENT TO SHOW/HIDE SPINNER IMAGE    

Creating Apex Rest Services and Testing it with POSTMAN

In this post, I am going to explain how to validate Apex Rest Service created in SFDC using POSTMAN (google chrome plugin).

First we will create a very basic Apex Rest Service.


After creating this class, now we can access this API by using below endpoint URL:

https://xxxx.salesforce.com/services/apexrest/RestAPIDemo
where xxxx is your domain URL or say instance URL like na15, cs30 etc.

Here we have created Rest API which accepts GET & POST request.Whenever we will perform GET request, API will return Account records based on search string passed as parameter in endpoint URL.

Now I will explain how to test this API Service by using POSTMAN.

In order to invoke Apex REST API, we need to have access token. So first we will use Oauth 2.0 to get access token from SFDC in order to perform API calls.

Steps to get access token from SFDC:

• Create a connected App in SFDC.

• Perform POST request from POSTMAN to below mentioned endPoint URL:

https://login.salesforce.com/services/oauth2/token?grant_type=password&client_id=CLIENTID&client_secret=CLIENTSECRET&

username=SFDCUSERNAME&password=SFDCPASSWORD_SECURITY_TOKEN

Where 

       CLIENTID = consumer key from created connected app

       CLIENTSECRET= consumer secret from created connected app

       SFDCUSERNAME = SFDC username

       SFDCPASSWORD_SECURITY_TOKEN = password + security_token

While performing POST request, specify header in which key will be "Content-Type" and value will be "application/x-www-form-urlencoded"

You will recieve JSON response in which access_token will be specified. Copy and save it.

Note:

If you have enabled my domain then you can use domain URL as base URL in endpoint URL. If you are not using domain, then in JSON response you will get instance_URL which you can use base URL whenever you call APEX REST API's.

How to perform GET request from POSTMAN to fetch data from SFDC

• First create Endpoint URL(GET request).

          https:// BASE_URL/services/apexrest/RestAPIDemo?searchString=test

          where 

          BASE_URL is instance URL returned in JSON while requesting Access token.

          RestAPIDemo is REST Resource we specify while creating class.

          searchString : parameter passed to REST API which will return matched accounts

• Specify Below headers

          [{"key":"Content-Type","value":"application/json"}]

          [{"key":"Authorization","value":"Authorization: Bearer Access_token"}]

• Perform Get Request from POSTMAN

How to perform POST request from POSTMAN to create new record

• Create a JSON through which you send account information.

       {

  "accName":"SKtest By POSTMAN",

   "aType":"New Customer",

   "aIndustry":"IT"

        }   

• Specify endpoint URL

       https://xxxx.salesforce.com/services/apexrest/RestAPIDemo

       where xxxx is domain of your org

• Specify headers

          [{"key":"Content-Type","value":"application/json"}]

          [{"key":"Authorization","value":"Authorization: Bearer Access_token"}]

• Send POST request through POSTMAN.

Note:

If your POST method contains parameter, then you have to pass JSON in different ways. For example POST method is:

@HttpPost   
    global static String createNewAccount(accountWrapper accDetails) {
        string returnString='';
        try{
            Account acc=new Account();
            acc.Name= accDetails.accName;
            acc.Type = accDetails.aType;
            acc.Industry =accDetails.aIndustry;
            insert acc;
            returnString = 'Account created successfully with record Id:'+acc.id; 
        }catch(exception ex){
            returnString = 'Request got failed: Error details-'+ex.getmessage();
        }
         return returnString;
    }

In this scenario, JSON which needs to sent should be in below format:

{
"accDetails":{
"accName":"SKtest By POSTMAN2",
"aType":"New Customer",
"aIndustry":"IT"
}
}

Hope this will help!!!!

More Blogs>>: 

USING DATABASE.UPSERT WITH EXTERNAL ID   
DYNAMIC APEX IN SALESFORCE   
SOQL INJECTION IN SOQL   
CUSTOM METADATA AND CUSTOM SETTINGS IMPLEMENTATION TRICKS   
SMART TABLE USING ANGULARJS IN VISUALFORCE PAGE   
REST API TUTORIAL FOR SALESFORCE   
VISUALFORCE COMPONENT FOR RECORD STATUS BAR   
DYNAMICALLY CREATING AND DESTROYING LIGHTNING COMPONENTS    
RAISING AND HANDLING CUSTOM EVENTS IN sALESFORCE lIGHTNING    
WHY TO USE DESIGN RESOURCE AND HOW TO ADD DYNAMIC OPTION TO DATASOURCE    
PASSING INNER WRAPPER CLASS TO LIGHTNING COMPONENT    
LIGHTNING COMPONENT FOR RECORDTYPE SELECTION FOR ANY SOBJECT    
FETCHING FILE FROM EXTERNAL/PUBLIC URL AND STORING IT IN SALESFORCE