Love Salesforce Yes: June 2021

Sunday, June 20, 2021

Show facebook public page in salesforce with lightning component

This post explains how to show any facebook public page in salesforce(Salesforce facebook integration). Below is demo of output :

Steps :

It is basically a four steps process :

1.) Generate iFrame code of your facebook page.

2.) Create a visualforce page.

3.) Create a Lightning component .

4.) Drag your lightning component anywhere in salesforce. That's all...!!!

Generate iFrame code of your facebook page

1.) First of all you have to generate the iFrame code of your facebook page. For that search developers facebook page plugin.

2.) You will see the facebook page URL textbox there. You just have to enter your page name at the end of the URL. Like I am integrating facebook public page with salesforce, you can integrate any page.

3.) Click on the get code button.

4.) Click on iframe, copy all the code and paste it on the notepad. This code will be used in the visualforce page.

Create a visualforce page(FacebookIntegration.vpf) :

1.) Create visualforcePage on your org and paste the iFrame code between <apex:page> tags.

<apex:page>

</iframe>

</apex:page>

Create a Lightning component(Facebook.cmp):

1.) Create Lightning component on your org and call visualforce page in <iframe> tag like below :

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >

<div>

<div>

</div>

</aura:component>

Use Lightning component anywhere:

1.) Now your component is ready. Preview your lightning component to test. You can drag this lightning component anywhere in salesforce.

Thanks,
Lovesalesforceyes

Saturday, June 5, 2021

Pass parameters from LWC to apex in salesforce

In this post I will explain how to pass parameters from LWC to apex.

There are basically two ways to call apex from LWC.

If you want to call the apex function onLoad of component.

@Wire
ConnectedCallback()

If you want to call apex function on some other event

In both the methods there is a small difference to pass data from LWC to apex. So let's get started:

Call apex function onLoad of component :

With the help of this methods apex function call on OnLoad of component.

Apex Class:

 public class ContactInfo {
    @AuraEnabled(cacheable=true)
    public static List<Contact> GetInfo(String Email, String Phone)
    {
        List<Contact> Con = [SELECT Id, Name, Email, Phone FROM Contact 
                             where Email =: Email and phone =: Phone];
        return Con;
    }
 }

ContactInfo class is used in LWC component in which GetInfo method is used to return the list of contacts. @Auraenables annotation is used to access the list from apex method in LWC.

With @Wire:

 import { LightningElement,track,wire} from 'lwc';
 import GetInfo from "@salesforce/apex/ContactInfo.GetInfo";
 
 @track Mail = 'ab@gmail.com';
 @track PhNum = '9876543210';

 @wire(ContactInfo, { Email : '$Mail' , Phone :'$PhNum' })
    Contacts(results){
        if(results.data){
            this.ContactData = results.data;
        } 
        if(results.error){
            this.error=results.error;
        }       
    }

@Wire hit every time, whenever you load your LWC component. In this, parameters are passed in single quotes with $ symbol.

With ConnectedCallback():

 import { LightningElement,track,wire} from 'lwc';

 import GetInfo from "@salesforce/apex/ContactInfo.GetInfo";
    
 @track Mail = 'ab@gmail.com';
 @track PhNum = '9876543210';

 connectedCallback() {

    ContactInfo({ Email : this.Mail, Phone : this.PhNum}) 
        .then(results => { 
                this.ContactData = results;  
                })
                .catch(error => {
                this.error = error;
                }
        );
    }

ConnectedCallback also onload of your LWC component

Call apex function on some other event :

If you want to call an apex method on any action like on click of button, then you can use this. In this apex method is called when you perform handleclick() action.

 
 import { LightningElement,track,wire} from 'lwc';
 import GetInfo from "@salesforce/apex/ContactInfo.GetInfo";
    
 @track Mail = 'ab@gmail.com';
 @track PhNum = '9876543210';

 handleclick(){
        ContactInfo({ Email : this.Mail, Phone : this.PhNum}) 
        .then(results => { 
                this.conLists = results;  
                })
                .catch(error => {
                this.error = error;
                }
        );
    }