Posts

Showing posts with the label Salesforce Lightning

Salesforce Lightning: Global Search

Image
Today we will have a look at creating a custom global search using Lightning and SOSL. We will use SOSL to query the results from database and show it on the lightning component using the lightning:datatable tag SOSL is preferred over SOQL in use cases where we want to search for a particular keyword across different objects. The return type of SOSL will be a list of list of sobjects.  List<List<sObject>> searchResult = [FIND :searchKey                                             IN ALL FIELDS RETURNING                                             Account (Id, Name, AccountNumber, Website),                                             Contact(Id, Name, Email, MobilePhone),                                             Opportunity(Id, Name, StageName, CloseDate),                                             Lead(Id, Name, Email, Company)]; Lightning datatable was introduced by Salesforce in Winter 18 release. With lightning datatable, now it has become very easy to

Salesforce Lightning: Countdown timer

Image
Today we will have a look at how to create a lightning component for countdown timer which can be used on pages where an operation needs to be completed within a specific time period. Example, an online exam or a banking transaction which expires after a specific time period. The component contains a datetime field which represents the end time. Once the user selects the date and time and clicks on Start Timer button, the countdown timer will start. Below is the lightning component: CountdownTimer.cmp <aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >       <aura:attribute name="endTime" type="String"/>       <aura:attribute name="timeLeft" type="String"/>       <lightning:tile label="Time Left" class="slds-page-header">         {!v.timeLeft}     </lightning:tile>

Salesforce Lightning: Password Strength Meter

Image
Today we will have a look at how to create a lightning component which analyses the strength of your password. The component only uses the standard lightning tags and no external JS library has been used to achieve this functionality. The functionality is handled completely at the client with no apex code, which makes it performance centric. To allow the user to enter password, I have used lightning:input with type="password". There is an ochange event configured on this input element which makes a call to JS controller and analyses the password. Once the analysis is completed, it sets a score for the entered password. To display the strength of the password, I have used below 2 components: lightning:slider lightning:progressBar Both the components use the score which is set by the controller method. If you want to add some chart which displays the strength, you can use JS libraries like chart.js. PasswordStrengthMeter.cmp <aura:component implements=&qu

Know Your Weather - uses Salesforce Lightning and Salesforce Lightning Design System

Image
Glimpse of the Weather app: This is a lightning app which makes use of lightning components and lightning design system. Special thanks to  Piyush Soni  for me helping me on this.Following components have been developed for this app: LatLng.cmp  - This component gets the current location of user who is accessing this app. This component has an associated JS controller - LatLngController.js and a JS helper - LatLngHelper.js Weather.cmp  - This component reads the latitude and longitude provided by LatLng.cmp and make a webservice call to openweathermap api and displays the weather data. This component has an associated JS controller - WeatherController.js, a JS helper - WeatherHelper.js, an apex controller which makes the webservice callout - WeatherCtrl.apxc and an apex class to parse the webservice response - WeatherResponse.apxc Lets take a look at the individual components and try to understand what they are doing. 1) latLngEvent.evt <aura:event type="