Posts

Showing posts from July, 2018

Using JavaScript Promises in Lightning Components

Image
With JavaScript being a single threaded process by nature, using "JavaScript Promises" it makes JavaScript to be a multithreaded or in other words it is a process of making Asynchronous calls using JavaScript. JavaScript Promises is a native JavaScript functionality that can be used in Lightning Components. Salesforce recommends using ECMAScript 6 (ES6, often referred to as “Harmony”) which is a standard script language. In case if the browser doesn’t provide a native version, the framework uses a polyfill so that promises work in all browsers supported for Lightning Experience. Basic Syntax for Promises: var promise = return new Promise(function(resolve, reject) { setTimeout(resolve, 100 , 'foo' ); }); Promise can return either resolve (If the result is success) and reject (If the result is fail). Optionally there is one more status called pending. Now let's go ahead and build a simple Lightning Component that will output some user information like...

Using jQuery in Lightning Components to Implement Dragging/Sorting

Image
jQuery is a lightweight JavaScript library, which makes it easy to use JavaScript. Using jQuery we can build some rich UI in our Lightning Components. In order to use jQuery in Lightning Components, we first need to upload jQuery related files to Static Resource. Below are the links for downloading jQuery/jQuery UI jQuery Download Link jQuery UI Download Link Once we have the files downloaded, we upload them to Static Resource using Setup-->Custom Code-->Lightning Components-->Static Resource Once we have the files uploaded to the Static Resource, we can use ltng:require tag to refer those jQuery files in our Lightning Components at the time of component loading. Below I have a sample component bundle (Component/Controller/Style) to display couple of "div" sections to display an Image that can be dragged to a droppable area and another section to display few rows that can be sorted using jQuery function. jQueryComp.cmp: This is the component code...

Lightning Component for Custom Lightning Templates

Image
Lightning App Builder provides flexibility to create custom Lightning pages which can be used in opposite of standard Lightning pages. Even though every standard Lightning page is associated with a default template component, Custom Lightning page template components are useful when you want a customized template for your business needs. Custom Lightning pages can be created for..... App Page - When you want to create separate pages for each app. Home Page - When you want to create separate pages to override the standard home page. Record Page - When you want to create pages on record level for different objects. In order to create custom Lightning Templates for App/Home/Record pages, it is required to implement below interface for each. lightning:appHomeTemplate lightning:homeTemplate lightning:recordHomeTemplate Note** Each template component should implement only ONE template interface. Template components shouldn’t implement any other type of interface, such ...