New answers tagged lightning-web-components
0
You can use getRecord and pass in the recordId parameter to get the Record response, which includes the apiName property. You still will need a call to the server, but you won't need any Apex.
1
no-cors prevents you from getting the response values in JavaScript (a so-called "Opaque" response). This is a security/privacy feature. See this Q&A on Stack Overflow. The server would have to be enabled to support CORS, which it appears is not the default. Presumably, they expect you to run your own. You should be able to spin up a server on ...
0
Two things:
Make sure you publish the event to the flow using the FlowAttributeChangeEvent event.
Outputs from an LWC FSC cannot (as of v.53.0) be listened to by other elements on the same page. The values are only available once you click next. i.e. Try creating another screen, and output the values there.
Publishing the event
See https://developer....
0
Official Documentation suggests using the getFieldValue function to get individual field data.
import { LightningElement, wire } from "lwc";
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import PARTICIPANT_FIELD from '@salesforce/schema/User.Contact.Active_Participant__c';
export default class MyComponent extends ...
0
You need to check that data.fields.Contact.value.fields[ACTIVE_PARTICIPANT_API.fieldApiName]
is defined before you can get it's .value
if ( data.fields.Contact.value.fields[ACTIVE_PARTICIPANT_API.fieldApiName] ) {
this.participantRecordId = data.fields.Contact.value.fields[ACTIVE_PARTICIPANT_API.fieldApiName].value;
} else {
this.participantRecordId =...
0
I know it has been several months since this was asked, but I came across this with a similar issue and was able to solve it, so I wanted to share.
When using a 'lightning-input-field', you can use a Styling hook to modify the minimum height of the LWC component. Try this in your CSS:
:host { --sds-c-textarea-sizing-min-height: 200px; }
More information on ...
1
you need to specify correct values for small-device-size, medium-device-size and large-device-size. Phone in tablet mode is considered as a medium-device-size. Useful info from documentation
Use the attributes of lightning-layout-item to configure the size of
the layout item, and change how the layout is configured on different
device sizes.
The layout ...
1
You specified key={r.id}, but you didn't actually assign a unique id value, so it would cause errors. I've cleaned up your code and fixed the problem.
The (a,b) => a + b syntax is an arrow function. We will pass this function in as a parameter to call the code dynamically. This eliminates much of the duplicated code.
import { LightningElement,track } from ...
0
<lightning-input type="date" onchange={handleCollectionDate} class="selector" min={mindate} disabled={disabled} >
</lightning-input>
@track mindate;
@track selector;
@track disabled;
dispSelectedDate;
connectedCallback() {
let today = new Date() ;
let dd = today.getDate() + 2;
...
0
The reason why LCC is used in those examples is because it is the latest example in current technology. You can't import React code directly into a LWC component, because the LWC compiler would need to know how to compile React; it does not. You can't import LWC into React, as far as I can tell, so React can't support @wire.
Even though both are built on the ...
2
I recollect that this is a design quirk of AuraHandledException and that e.g. this is needed (constructor argument probably doesn't matter):
AuraHandledException e = new AuraHandledException(System.Label.consulta_saldo_cliente_18);
e.setMessage(System.Label.consulta_saldo_cliente_18);
throw e;
which is not convenient so best to wrap in a method:
private ...
1
It doesn't look like lightning-datatable (actually lightning-formatted-url, which it uses) directly supports other protocols besides http or https. This is probably to prevent Cross-Site Scripting (XSS) vulnerabilities. Even the mailto protocol appears to be unsupported.
You can specify a relative URL using /, ./, etc. See documentation for lightning-...
0
For those interested - the solution is to leave lwc compiling to lwc-webpack
Specifically, exclude any folder containing lwc i.e. "src/modules" or "node_modules/lightning-base-components" from getting processed by the default Storybook's webpack config.
The config would look like something in the lines of -
{
test: /\.css$/,
use: ...
2
As Derek mentioned, MailingCountry is part of the MailingAddress compound field on the Contact object. So it should exist.
Another possible explanation for your issue is that you don't have State and Country/Territory Picklists enabled in your org.
Once you have that enabled, the first block of code in the blog entry you linked should work, although it's ...
2
The MailingAddress and ShippingAddress fields are special compound fields. They're read-only, and hide the fact that there are indeed separate fields backing them.
So while you won't find MailingCountry explicitly listed as a field on the Account or Contact object, the field does in fact exist.
This information is also corroborated by the SOAP API ...
0
order of apex imperative also is not guaranteed, I have put all the output in one method call and used within @wire. that worked for me.
Thanks you Matthew Souther and sfdcfox for your time.
1
Note that 'undefined' is different than undefined. The former is a string with the word undefined in it, the latter is a type of null value that means "an undefined value."
Note that in JavaScript, both of these values are considered "falsy", so you can use behavior to write the logic simply as:
get displayFundStrategy() {
return !!...
1
So it turns out Base_Station__c is a lookup, and you are trying to push a String value = csvRowData[0] which is just a string, thus it fails.
You need to query the data first and fetch the ID for the field and populate the ID there.
0
Easiest way would be to just show a spinner until the action of your Apex logic is executed successfully. The spinner will indicate that some processing is happening and the overlay of the spinner will hide the Next button.
@api
validate() {
// Call Apex method logic
callApexMethod().then(data => {
//stop showing Spinner
}).catch(error ...
1
event.detail.row isn't an Array, it's a single object. You may have meant:
this.finalSObjectDataListChild = [dataRow];
Which would make it suitable for lightning-datatable.
1
Since your row data depends on the result of a wire, you need to ensure that the "initialization" is performed after that wire returns the required value.
Note, also, that doInit is not an LWC construct, but rather is Aura's equivalent to the LWC connectedCallback. However, you cannot use LWC's connectedCallback because this would be called before ...
1
As per @SachinHooda's suggestion in comment, Replaced lwc combobox with with and that fixed the issue.
<div class="slds-select_container" >
<select name="peGroup" value={selectedId} class="slds-select" onchange={handleChange}>
<template for:each={options} for:item="opt">
...
0
Why not call getInitialAccountRecords imperatively instead? For example:
@wire(CurrentPageReference) {
getStateParameters(currentPageReference) {
if (currentPageReference) {
this.screenMode = currentPageReference.attributes.apiName !== undefined ?
currentPageReference.attributes.apiName.substr(
currentPageReference....
0
I do not agree with Denis as there are lots of use cases where we may not want to change the existing data structure because of certain reasons. Well in that case you may want to have a look at the recently introduced contents property. This surely is available to fulfill this kind of purpose.
You only have to add display: contents property to the elements ...
0
I would "flatten" your parent-child tree into an array : https://stackoverflow.com/questions/28453824/flatten-hierarchical-data, then I would apply flexbox to all the elements to show them https://css-tricks.com/snippets/css/a-guide-to-flexbox/ Good luck!
2
Define the class level attribute to store the columns, columns. From the wired method add the dynamic columns to that.
export default class MyComponent extends LightningElement {
@track columns = [
{
label: 'View',
type: 'button-icon',
initialWidth: 75,
typeAttributes: {
iconName: '...
1
First, you cannot control the order of wire methods and how/when they are called. This is managed by the framework.
Your property needs to be reactive:
@wire(getInitialAccountRecords,{action:'$screenMode', recordId:'$recordId'})
Note that this will will be called multiple times. You will need to account for this in your code:
@AuraEnabled public static ... ...
1
lightning-record-form component will be based on standard page layout. Dynamic action will not impact it. I have done a quick check on this:-
Even if you remove a field from dynamic form, if the field is available on standard page layout, it will appear on the record form component.
My record Form component looks like this:-
<template>
<...
0
The list view and related list are two different things. You cannot customize the related list to show a list view based on record id out of the box inside salesforce.
For example:- On an account record, the contact related list will show all the contacts associated with it. You can not show a list view on the related list.
Coming to ...
0
For a LWC Screen Action, use getRecord from the Wire Service wrapped in a function. That way you can use the reactive $recordId and then call init. No need to use connectedCallback() or renderedCallback().
//Call this before init to get recordId
@wire(getRecord, {
recordId: '$recordId',
//Add whatever fields that you may need or just use Id
...
0
While I was not able to find a solution to resizing this component, it does appear to not overflow on the mobile app. For whatever reason it looks completely different when using chrome dev tools, but in the App it sizes correctly.
1
You can use layout-type instead:
<lightning-record-form
record-id={recordId}
layout-type="Full"
object-api-name={objectApiName}>
</lightning-record-form>
The layout will be driven by the user's page layout assignment.
0
An extract from the documentation says:
Creating a new record from the lookup field's dropdown menu is currently not supported.
https://developer.salesforce.com/docs/component-library/bundle/lightning-input-field/documentation
0
Lightning data-table easily helps us to show large data in tabular format, with a flexible selection approach.
When pagination applies with the LWC: Datatable pre-selected-rows, it does not work straightforward way. Because apply pagination helps to display only selected page information and hide the rest of the records actually they are not populated yet.
...
2
For completeness, there are six distinct scopes. They are, in order of largest to smallest access: global, import, component, instance, closure, and local.
Global scope is only available in LWC OSS. Every component in every namespace can use values from this scope. As far as I'm aware, there's no component-accessible objects available at this scope in ...
0
The wire adapter you are using to source data is not parameterized:
@wire(getProvider)
wireddata({ error, data }){
so the data in your data table has no connection to any other input or component state. The wire adapter will always return the same data.
It's not clear to me from your question, which lacks some details, whether the right approach is
to use ...
0
You can use indexes of both iteration to specify unique selectors for each element. And later on submit you can use them to select particular inputs from a table's row. The idea would be something like,
.html
<template>
<div class="app table__form slds-card">
<template for:each={products} for:item="product" for:...
1
first, you need to add an identifier (a class, a custom attribute) something, so you can easily Access Elements the Component Owns, for all values, you probably want to use querySelectorAll.
you would use a query selector as you would for any html document. however, instead of document, you would be using this.template
5
This has nothing to do with polymorphism. Polymorphism deals with situations where you have multiple classes that share a common ancestor. What you're dealing with are called "overloaded methods." This is not supported with @AuraEnabled. Each method you want to call must have a unique name. This is because of how the underlying API is designed.
...
1
I'm using the Experience Builder for an LWR site, and this seems to be working. Create a named slot in your HTML:
<slot name="content"></slot>
Then declare it in your JS using JSDoc syntax (The comments here are actually important):
/**
* @slot content This is the main content slot
*/
export default class MyExample extends ...
1
Yes, this seems to work exactly as advertised. I wrote a simple popstate demo for you.
import { LightningElement } from "lwc";
export default class App extends LightningElement {
_handler;
connectedCallback() {
window.addEventListener(
'popstate',
this._handler = (event) => this.handlePopState(event)
);
}
...
0
For some strange reason in LWC, Name field from PermissionSetTabSetting returns either standard object name or custom tab id, while in Classic, it returns the tab name.
Workaround here is to use Tooling API with Classic Session Id.
Create Visualforce Page 'Api'.
<apex:page controller="ApiCont" showHeader="false" sidebar="false&...
1
Ok, so there's something funky going on with the Flow engine, and the formula approach is a bit of a red herring.
Short answer, I don't think there's anything wrong with {!$GlobalConstant.True}.
The issue is with the default value.
In my meta.xml, I had default="true" for inputBoolean, so when I added the component to the flow screen, I didn't need ...
2
Yes, Lightning Message Service (LMS) does work from a Lightning Web Component Action. The APPLICATION_SCOPE does not necessarily have to be set.
(My problem was that a component I had removed from the UI at the same time contained the subscriber. This code was written by someone else, and the subscriber component being "hidden" within the component ...
0
I've seen that even though we import the field from the external object path .../externalObject__x.customfield__c the objectApiName of the imported field will have the custom object suffix ( __c ) instead of the external object suffix( __x ).
I've managed this to work by manually defining the structure of the field and making sure the objectApiName has an ...
0
I have returned with answers! Thank you for any patience and assistance provided. I managed to get everything pushed over via change sets so that the Experiences were on equal footing, pulled down the ExperienceBundles for each, then went from there.
First: Why didn't the IDs of the components match?
Answer: This is because they, at the time, were pushed ...
0
We need to add one check in lightning data table as max-row-select ='1'
0
So! my requirement was to open LWC in New Page from Quick Action. I tried many methods like
LWC to LWC
Button URL
AURA to LWC
FOR LWC to LWC -- Some of the standard objects does not support LWC as Quick Action
After I tried, AURA to LWC, that works fine :)
AURA.cmp:
<aura:component
implements="force:appHostable,flexipage:...
0
In order to force read-only properties recursively, I wrote a readOnlyProxyHandler. This is by no means fully tested, but should work for the purposes of this answer.
// readOnlyProxyHandler.js
const readOnlyProxyHandler = ({
get: function(target, key) {
if(key === Symbol.iterator) {
return target[key].bind(target);
} else if(typeof target[...
1
This is all kudos to @MarkPond who provided the answer in the comments above.
Have you looked into MouseEvent.pageX and MouseEvent.pageY instead?
This resolved my question perfectly. See image below -
Top 50 recent answers are included