New answers tagged lightning-web-components
1
vote
Accepted
How to hide column in Datatable LWC?
You can do something like that:
const fieldsToNotDisplay = ['IncidentSuivi__c'];
this.fieldsForCloumn = items
.filter(field => !fieldsToNotDisplay.includes(field))
.map(field => (this....
- 1,347
0
votes
How to delete columns from Datatable using LWC?
You can use .filter.
You will leave only columns, where fieldName is not included in this.allSelectedField.
this. fieldsForCloumn = this.fieldsForCloumn.filter(
column => !this.allSelectedField....
- 1,347
0
votes
LWC - Perform Data validation on Table upon entering value on Table column and populate other columns
I wrote a simple example of how one might accomplish this. Basically, you just need to set the desired values. As an HTML table, you have to set the values yourself, while with lightning-datatable, ...
- 445k
0
votes
How can I get custom related list records in LWC?
I was facing same issue.
Adding __r fixed the issue.
@wire(getRelatedListRecords, {
parentRecordId: '$recordId',
relatedListId: 'Todo_List__r',
fields: ['Todo_List__c.Id','Todo_List__c....
0
votes
Deploy source to org fail!
Make sure that component name is not duplicate in your Org.Check is there any lightning or lightning Web component already exist with same name.
If component already exist in your org, then change the ...
- 517
0
votes
Multi column sorting in lightning web components
Please refer to below example
multicolumnSortingExample.html
<template>
<lightning-card title="Multi Column Sorting">
<template if:true={sortingColumnsNames.length}...
0
votes
LWC Lightning Data Table - Save All Records(Rows) in the Table upon Save Button Click
possible solution could look like (id is a key-field)
handleSave(event) {
const updatedRecords = event.detail.draftValues
const updatedData = this.data.map(row => {
const newRow = ...
- 471
0
votes
Array is being changed to String inside a arrow function
At the end it was a simple fix.
This line of code this.recipients = event.detail.value was converting my array to a string .
All I did was initiate a push method and keep it as array.
this.recipients....
0
votes
LWC Lightning Data Table - Save All Records(Rows) in the Table upon Save Button Click
For fetching all the rows in the table, we need to get 'data' attribute
A modified version of your code to fetch data from table
handleSave(event)
{
const updatedFields = event.detail.data;
<your ...
- 90
0
votes
Apex Method doesn't return any value
I would move to the use of a wire adapter for this, because you don't know when your recordId param is going to have data.
Make sure your Apex is cachable
@AuraEnabled(cachable = true)
Don't forget ...
- 18.6k
0
votes
Apex Method doesn't return any value
Did you import the apex class in your LWC? If not I suggest you do that first. import getvolume from **put in the address here**
After that make sure passs the record Id to that method.
To get the ...
- 34
0
votes
Locker Service SecureWindow returning undefined nodes in Selection API
This has started working now, SecureWindow no longer returns undefined for text nodes.
0
votes
Accepted
LWC dynamically render components and call method for each
You can wait for a render cycle asynchronously:
async parentMethod( data, type) {
let dataObject= {
type:type,
data:data
}
this.dataList.push(dataObject);
...
- 445k
0
votes
LWC dynamically render components and call method for each
You can use renderedCallback()
doc - https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_lifecycle_hooks_rendered
parent.js
renderedCallback() {
console.log(...
- 471
2
votes
Accepted
LWC - Pass event to Aura Component
try sending your data using the detail property on the event's payload, something like this:
const selectedEvent = new CustomEvent('testevent', { detail: { testMessage: 'Hi there' }});
instead of ...
- 500
0
votes
Create a Lightning web component for creating records for master detail type
You can use lightning-record-form to display the Full or Compact Layout,
If you want to customize more then you Can go via lightning-record-edit-form
Html
<lightning-record-form
object-api-...
- 1,493
0
votes
Create a Lightning web component for creating records for master detail type
How about trying lightning input field for lightning record edit form
<lightning-record-edit-form object-api-name="Flat__c" record-id={recordId}>
<lightning-input-field field-name=&...
- 90
0
votes
Refused to frame because of ancestor violation with CSP's while using a connected app and displayed through the canvas app
Canvas apps are served from "*.salesforce.com" so that also needs to be included in your CSP header. For example with a Lightning + VisualForce + Canvas combination the following CSP header ...
- 101
2
votes
Accepted
LWC Code not displaying data
You have used this :
getAccounts().then(function(result){
console.log(result);
this.accounts = result;
}).catch(function(error){
console.error(error);
});
}
You need to ...
- 7,224
0
votes
LiveAgent Chat + Lightning Out throws "$Lightning.use() already invoked with application"
we managed to get this to work by using the same app as the live chat:
$Lightning.use("embeddedService:sidebarApp", function()
0
votes
Accepted
How to preserve formatting in long text fields in LWC components
To display the preformatted tags either use <pre> tag.
- 18k
0
votes
Accepted
Creating Multiple Data Table for list of Records using LWC
You have to put all of the data that you want to be individualized into the data together. From there, you need to use those individual variables to render the tables.
const tables = [
{
id: '1',...
- 445k
1
vote
Lightning Web Component Action not showing up on community page
In the release notes that delivered this feature Release Notes
This change applies to Lightning Experience desktop in Developer, Enterprise, Essentials, Professional, and Unlimited editions. Quick ...
- 1,493
-1
votes
Basic LWC SLDS but columns horizontally uneven
Try this please, If this solves the issue please mark as best answer.
Edit -- I didn't mention the reason for this, so I've added a slds-List_horizontal class which can be used to get elements in a ...
- 34
2
votes
How to get count of opportunities related with an account in SOQL query?
You can only use aggregate expressions in root Queries. for getting the count if opportunities on each account you have to use the below SOQL query.
SELECT count(id), AccountId FROM Opportunity GROUP ...
- 1,730
0
votes
Basic LWC SLDS but columns horizontally uneven
Please try to use lightning card instead of slds- card like below. It might help you to align columns horizontally in even manner.
<template>
<div class="slds-grid slds-gutters"&...
- 517
1
vote
Accepted
Filter and Slice in LWC Array
this.fieldToUpdate = this.fieldToUpdate.splice(
this.fieldToUpdate.filter(
(key) => key !== event.detail.name,
(value) => value !== event.detail.realValue
),
0
);
I ...
- 445k
0
votes
Accepted
How to track change on an Account field in LWC?
You'd have to know the old value and new value to know if there was a change.
wiredAccount({ error, data }) {
if (data) {
const oldData = this.record;
this.record = data;
if(...
- 445k
1
vote
Selected Date Field wont stay on page after clicking out of field
Set
showDatePicker = "false"
should work. Setting showDatePicker = "true" is defaulting the date format to dd/mm/yyyy format which doesn't conform to HTML5
- 59
2
votes
Accepted
How to get mouse position?
You have several problems. PageX and PageY should be pageX and pageY. JavaScript is case-sensitive. Further, we typically put hovers next to an element, not right on the mouse cursor. This causes ...
- 445k
1
vote
Implement three state checkbox using LWC
As of now, no direct attribute/property for indeterminate is available for the lightning-input component as per the component library.
There was however mention of an indeterminate state in the SLDS. ...
- 2,901
0
votes
Can we access the key attribute when handling an event from a foreach template
Tested in sandbox :
HTML:
<template for:each={itemList} for:item="item">
<li key={item} data-item={item} onclick={handleItemClicked}>{item}</li>
</template>
JS:
...
- 1
0
votes
Accepted
Passing a MAP from LWC to Apex
As written, your JavaScript is making an Array of key-value pairs. In Apex, that would be:
public class KeyValuePair {
@AuraEnabled public String key { get; set; }
@AuraEnabled public String value ...
- 445k
2
votes
Accepted
LWC select element with multiple
You can read the options directly from the element:
let selected = [...event.target.options].filter(
(option)=>option.selected
).map(
(option)=>option.value
);
This also means you don't ...
- 445k
2
votes
Unable to get Map as return value from Apex in LWC using Imperative Call
The problem is that you iterate through the map in the wrong way.
Try something like that:
const results = {
Agriculture:'Agriculture',
Apparel:'Apparel',
Banking:'Banking',
Biotechnology:'...
- 1,347
1
vote
LWC select element with multiple
you want to avoid having to query the DOM to get selected values, instead, try updating a property within an array, or adding selected values to an array in your controller, and fetch the values from ...
- 19.5k
2
votes
Accepted
How to reduce array and add related integers together
I think that the best approach would be first doing all the sums, and the formatting as you like
Object.entries(
input
.reduce(
(prev, current) => ({...prev, [current....
- 750
0
votes
How to tell if refreshApex has new data?
refreshApex is asynchronous, so you can copy the old value and compare to the new after waiting for new results:
async handleClick() {
let oldData = JSON.stringify(this.wiredRecord.data);
await ...
- 445k
0
votes
invalid element error in the fill <runtimeNamespace>
That's just a linter error; you can report this to the VS Code Salesforce Extension Pack team if you want to on their GitHub page. It shouldn't stop deployments to your org, however. Note, however, ...
- 445k
0
votes
Accepted
LWC lighting-map not showing custom icons
I found what the problem was, for some reason, when using the "SFDX: preview component locally" functionality from VSCode, the icons don't work, I added the LWC to a page and the icons ...
- 262
1
vote
LWC: How to make DIV fit with mobile view
I will add important details for the answer provided by @glls. Documentation for layout-item
If you specify the small-device-size, medium-device-size, or
large-device-size attributes, you must also ...
- 17.4k
3
votes
LWC: How to make DIV fit with mobile view
from the docs - Create Responsive Layouts
you can use the *-device-size property to change the size depending on the viewport.
Example:
<lightning-card>
<lightning-layout multiple-rows&...
- 19.5k
0
votes
I want to display all the active users present on my org in a dropdown menu
In getUserName Controller wiredData method, data which will be returned will be a List. You can directly use map function directly on the list i.e. data.map, instead of using data.values.map.
This ...
- 91
1
vote
Accepted
Hi Small help, can any one suggest me on this
You cannot use relationships as value. Your data structure should be plain.
The easiest way to do something like that is:
this.opportunities = data.map(opportunity => ({
...opportunity,
...
- 1,347
1
vote
Accepted
alignment issue with lwc
Did you try something like that?
<tr key={rec} class="slds-hint-parent row">
...
</tr>
.row {
display: flex;
align-item: flex-start;
}
- 1,347
1
vote
LWC lighting-map not showing custom icons
Not sure why but in me based on your code I see custom star icon based on your SVG.
Do you see a different icon, or it might be a caching issue?
Unrelated information:
Setting lowering zoom level ...
- 18k
2
votes
Accepted
Metadata API 'Quick Action' - Required fields are missing: [Component] (REQUIRED_FIELD_MISSING). Fields Component
You need to add type info for all the newly added parameters and also add then in the order info array.
- 38
0
votes
How to display images formula fields in LWC datatable not AURA
As author have stated, we can use this link to learn how to create custom type:
https://salesforcecodex.com/2019/10/show-image-in-lightning-web-component-data-table/
Afterwards, in the HTML of your ...
0
votes
How to override LWC lightning record form Cancel button
As stated in documentation, use the oncancel attribute to do anything we want in the js file.
In my case, I used the function which closes the modal pop up window.
.HTML file
<div class="slds-...
1
vote
LWC - NavigationMixin From Flow
In your JS: Does your class header look like the one in the following example?
// ... NavigationMixin import ...
// Notice the NavigationMixin(LightningElement)
export default class ExampleLWC ...
Top 50 recent answers are included