Pages

Friday, July 28, 2017

Language Translation in VisualForce Page

Salesforce provide functionality through which you can create single VF page and that can be translated in different languages based on language or locale preference of current logged in user.

You need to upload the translation of all custom fields which you are going to use in VF page and can utilize custom labels to display warning, error information on VF page.

In order to render the VF page in particular language, use Language attribute on <apex:page> tag. You can also bind this values with controller variable so that you can render VF page in different language.

<apex:page controller="SK_LocalizationTestController" language="{!selectedLang}">

I have created a very simple VF page to illustrate this functionality by displaying account information. I have dropdown on VF page through which user will select language and VF page will re render to display page in selected language.





Note:
  • If you are displaying page message using <apex:pageMessages>, then use custom label on apex class to display message. Upload all translation for custom label in salesforce.
  • For custom fields also you need to upload language translation. Please refer Translation Workbench under Set Up.
  • The language attribute does accept ISO country codes plus an optional locale like en,en_US,de,de_DE etc.
  • For displaying header or pageblock section title, use custom labels.

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   

Monday, July 24, 2017

Changes to Lightning Data Services (LDS) in Summer'17 Release

Lightning Data Service is used to load, create, edit, or delete a record in Lightning component, without using server side Apex code. Lightning Data Service takes care of sharing rules and field-level security.

Below are changes to LDS in Summer'17 Release

  • force:recordPreview has been deprecated. Now use force:recordData instead of force:recordPreview. 
  • targetFields attribute is added to force:recordData, which is populated with a simplified view of the record’s fields. targetFields is automatically updated a record changes.
  • The targetRecord attribute of force:recordData,  has been updated to return records in a new format. 
Old JSON format was :
{
    "AnnualRevenue": null,
    "BillingCity": "Toronto",
    "CreatedById": "005R0000000IXV3IAO",
"CreatedBy.Name": "Admin User",
"CreatedBy": {
        "Id": "005R0000000IXV3IAO",
        "Name": "Admin User",
        "sobjectType": "User"
    }
}


New JSON Format is:
{
  "apiName": "Account",
  "fields": {
  "AnnualRevenue": {
  "displayValue": null,
  "value": null
  },
  "BillingCity": {
  "displayValue": null,
  "value": "Toronto"
  },
  "CreatedBy": {
  "displayValue": "Admin User",
  "value": {
  "apiName": "User",
  "fields": {
  "Id": {
  "displayValue": null,
  "value": "005R0000000IXV3IAO"
  },
  "Name": {
  "displayValue": null,
  "value": "Admin User"
  }
  },
  "id": "005R0000000IXV3IAO",
  "recordTypeInfo": null
  }
  },
  "CreatedById": {
  "displayValue": null,
  "value": "005R0000000IXV3IAO"
  }
  }
 }

The following example shows the targetFields attribute within the force:recordData component.

<force:recordData aura:id="skss"  recordId="{!v.recordId}"  layoutType="{!v.layout}"
  fields="{!v.fieldsToQuery}"  mode="VIEW"   targetRecord="{!v.record}"
  targetFields="{!v.simpleRecord}"   targetError="{!v.error}" />

For complete understanding of LDS along with code, refer Lightning Data Services : Way to perform operation on records without using server-side Apex class  blog

More Blogs>>: 
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    

Thursday, July 20, 2017

Inheritance in Lightning Components

Lightning framework also support component inheritance in same way as it is supported in Apex.
You can mark any component as extensible means component can be inherited by any component. Inheritance allows us use attributes and javaScript functions of extensible component in all inherited components.

Consider a scenario in which you have many components which call server side apex controller method from their helper function. So instead of writing callToServer method in all components helper function, you can create a component and mark it as extensible component and write callToServer function in helper function. Now in all your components, extends this component and on any action just call callToServer function.

I have created component "SK_CallToServerUtility" which contain javascript function in helper which performs call to server side apex methods.

In order to mark any component as extensible, just specify extensible="true" in component attribute.

<aura:component extensible="true">
    <!-- below attribute value will be set by components which will inherit it-->
    <aura:attribute name="msg" type="String" default=""/>
{!v.body}
</aura:component>

If you want to inherit any extensible component, then specify component name in extends attribute in component like extends="c:SK_CallToServerUtility".

Please refer below code to have better understanding about inheritance in lightning components.



Code Explaination:

I have created SK_AccountList component which will initially display latest 100 account records by calling callToServer function in doInit function.

When user enter some search string and click search account, then table will display account records with name matching with search string again by calling callToServer function present in SK_CallToServerUtility component  which is inherited by SK_AccountList component.

Also in SK_AccountList component, we are setting the attribute value("msg") of SK_CallToServer component.

Hope this will help in basic understanding of how to use inheritance in Lightning Components!!

Looking forward for everyone's comments and feeback.

More Blogs>>: 
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    

Saturday, July 1, 2017

Firing Event from Lightning Component and Passing Parameter to VF Page

In this blog, I am going to explain the way through which you can pass parameter from Lightning component by firing event from it and handling it in VF page and display the passed parameter in VF page.

If you want to understand how you can fire event from VF page and handle it in Lightning component, then refer below blog:

How to Fire Lightning Events from VF Page in Lightning

I have created a VF page which contains input text which will display Account Id which will be passed from Lightning component. This VF page also contains div container which will display lightning app which contains our lightning component.



Below is complete code for above example:

Note:
  • If you don't have namespace in your org then on VF page use "c:" instead of "skforce:" like c:SK_AccListViewApp
Hope this will help!!!

Looking forward for your comments and suggestions...

More Blogs>>: 
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