Skip to main content

Posts

Showing posts with the label Lightning

Use of wrapper class in lightning:datatable

As you guys know the wrapper class concept in visualforce pages , we generally use it to create a data-table which fetches data from different objects or if we want to redirect user to some other page on click of a link as one of the column of data-table.        For example we want a column "Account Name" on the data-table which is a link and once user clicks it should redirect respective account record. Or , suppose we want to display a column with some images or icons as a visual indicator Or what not. These requirements require us to use a wrapper on the lighting data-table (lightning:datatable) I am going to use my previous account search example ( Account Search Lightning Component ) and explain the use of wrapper. AccountSearchWrapper.app <aura:application extends="force:slds" access="global" >     <c:AccountSearchWrapper /> </aura:application> AccountSearchWrapper.cmp <aura:component controller="...

Dynamically populate lightning:combobox

In order to dynamically populate values in lightning:combobox using javascript we can create a list variable and push the values. We also require the values like ids associated to the particular option for back-end logic. For example  : If we want to show the list of contacts using lightning:combobox component where the option should display the contact name but the value should be the contact id which will be used for back-end logic For this we can create a temporary Map variable in our lightning component and set the value and label parameters of the lightning:combobox. Here is the code for this component Combo.app <aura:application extends="force:slds" access="global" description="Lightning Combo Demo"> <c:Combo_Cmpt/> </aura:application> Combo_Cmpt.cmp <aura:component implements="flexipage:availableForAllPageTypes" access="global" controller="ComboController"> <!-- ...

Account Search Lightning Component using lightning:datatable and KeyUp event Salesforce

In this post we will see how can we use the out-of-the-box lightning data table to show the account search result. This can be used in many place since search is a very common requirement. AccountSearch.cmp <aura:component controller="AccountSearchController" implements="force:appHostable,lightning:actionOverride,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction,lightning:isUrlAddressable" access="global"> <aura:attribute name="data" type="Object"/>     <aura:attribute name="columns" type="List"/>     <aura:attribute name="selectedRows" type="List" />     <aura:attribute name="maxRowSelection" type="Integer" default="1"/>      <aura:attribute name="selectedRowsList" type="List" />     ...

Favorite / Follow Lightning Component using Bootstrap in salesforce.com

As you know Lightning uses a java-script based aura framework. It makes it very easy to plugin with any other java-script libraries like React and Bootstrap. Also , you can use popular analytics and map libraries like Leaflet and D2 Charts. In this example we will create a lightning component which will allow user to follow the records , this is different from salesforce's follow icon , as part of this component we will create a field (Follow) on Account Object , which will be checked if a user follows that record from Salesforce1 mobile app or web. We will use this bootstrap's " glyphicon "  icon. In this example you can also get familiar with how to use Application events , embed bootstrap and  JQuery in your lightning component. We will fetch few accounts from system and use this icon to follow the records. Here is how it will appear in Salesforce1 mobile app. Prerequisites :- 1. Download latest jQuery and add in static resource and ...

Update tab label on Salesforce Lightning Service.com Console

Records in Salesforce service console takes standard name or casenumber as default tab name. To override the default tab name , we can leverage console javascript tool kit by using getFocusedTabInfo() to rename the tab. For that we need to create a lightning component and add it to the lightning page of record in service console by editing the page ( Edit Page ). Here is the code of the lightning component. RenameTab.cmp (Component file) <aura:component controller="TabLabel" implements="flexipage:availableForAllPageTypes" access="global" >         <lightning:workspaceAPI aura:id="workspace" />          <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>     <aura:attribute name="case" type="Case" /> </aura:component> RenameTabContoller.js (Controller file) ({          doInit : function(component, event, h...