Posts

Showing posts from April, 2020

Salesforce LWC: Generic Lightning Datatable using Lightning Web Component

Image
Today in this blog we will go though generic Lightning Data Table using Lightning Web Component. Using below code user can show data of any object in Salesforce Org. Below is the HTML code where we have used lightning-datatable standard lightning web component. In this component we are passing two values. 1. columns: List of columns which needs to be added in table. 2. finalData: this is the list of data which needs to be displayed. 1 2 3 4 5 6 <template> <div style= "height: 300px;" > <lightning -datatable key-field= "Id" data= {finalData} columns= {columns} hide-checkbox-column= true > < /lightning-datatable> </div> </template> Now in Java Script file we need to handle the data which will be sent by its parent component. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 import { LightningElement, api, tra...

Salesforce LWC: Multi-Select pick-list using Lightning Web Component

Image
In this blog we will learn about creating basic multi-select pick-list field using Lightning Web Component. To implement multi-select pick-list we need a very basic UI with two standard lightning web component: 1. lightning-combobox 2. lightning-pill We will use lightning-combobox to show all pick-list values and lightning-pill will help us to show selected pick-list values. Lets go ahead and create basic HTML file: <template> <div class= "slds-p-around_xx-small" > <lightning -combobox name= "progress" label= "Status" value= {value} placeholder= "Select Progress" options= {options} onchange= {handleChange} > < /lightning-combobox> </div> <div class= "slds-p-around_xx-small" > <template for:each= {allValues} for:item= "val" > <lightning -pill key= {val} label= {val} name= {val} onremove= {handleRemov...

Followers