Questions tagged [lwc-dom]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
-1
votes
1answer
16 views

Salesforce LWC : how to call a method of the loaded script in the javascript?

how to call a method of the loaded script function in the javascript? Ex: if I have loaded a script named ‘abc’. Now I want to call a method of the abc. Let the method be fgh. How do I call it in LWC?
0
votes
2answers
39 views

Hide save button in lightning table in LWC

html: <lightning-datatable data={addressData} columns={columns} onsave={handleSave} key-field="id"></lightning-datatable> Js: handleSave(event){ let ...
0
votes
1answer
28 views

Add both dynamic and literal CSS classes to the same element

Pretend I have an element that I wish to give a literal class, such as: <p class="slds-text-title">My Title</p> But I also have a dynamically determined class I wish to add, which I ...
2
votes
2answers
80 views

Append child dynamically from JS in LWC

I am facing a problem in the following code in my lwc component. Whenever I try to append a child dynamically from Js in LWC component. I got this error. HTML : <template> <lightning-...
0
votes
1answer
27 views

Lwc- problem to get id as it changes with random no. inside external Js

Hi all I am trying to access the id of a div in lwc with the help external js(static resource) where code is like document.getElementById("createsulightning"); for <div id="createsulightning">&...
0
votes
1answer
34 views

Confused displaying Visualization in LWC

I'm trying to display a basic visualization in LWC using vis-network.js. The example I'm trying is here Here is my code. Component.html: <template> <lightning-card title="Sand Samples" ...
0
votes
0answers
42 views

LWC not able render Html JS

Below is my requirement - From Salesforce we are calling a service which returning a large set of html which include JS. When Copy paste same html(including js) in notepad++ and save it as .html ...
1
vote
1answer
106 views

Order of execution in Lightning Web Components

I have a parent and a child component below is the code: Parent component HTML: <template> <lightning-tabset> <lightning-tab label="Child One"> <c-child-...
0
votes
1answer
65 views

LWC setCustomValidity on lightning-input-field

I'm using a <lightning-record-edit-form> with <lightning-input-field> children. When required fields are not populated, it occurs the standard message "Complete this field". What I want ...
0
votes
1answer
53 views

Lightning Web Component dynamic action button name

I'm trying to get a dynamic lightning button using Lightning Web Components, what I currently have is a wrapper class which builds the necessary data I need and outputs it neatly in a table. This is ...
1
vote
1answer
75 views

How to reset or deselect lightning-radio-group option

Once selected, radio buttons cannot be deselected. Is there a way to reset the lightning-radio-group component or deselect the selected option?
0
votes
1answer
71 views

How to access shadowroot elements from JS in a LWC component

I have the following HTML in my LWC component- <template> <div class="firstdiv"> <div class="firstinsidefirstdiv fifd"> 1234 </div> <div class="...
0
votes
1answer
57 views

Salesforce LWC aura_prod.js:3 Uncaught (in promise) TypeError: Cannot read property 'Symbol(ViewModel)' of undefined

I am getting below error when i try to pass data to apex. I did everything to debug but unable to find root cause. aura_prod.js:3 Uncaught (in promise) TypeError: Cannot read property 'Symbol(...
0
votes
0answers
49 views

Hook into before unload of salesforce standard tab in lighting web component

Is there any way to detect and execute some JavaScript method before unload of salesforce standard tab inside LWC.
1
vote
2answers
660 views

Get labels and values of each field in lightning-record-view-form in LWC

I want to get field-name(label) and field-value of each field for validation as shown below. Is there any way to do it in LWC? sampleRecordViewForm.html <template> <lightning-record-...
3
votes
1answer
189 views

Dynamically changing lightning button icon name with setAttribute not working

I'm trying to change the icon of a lightning button icon but the image isn't changing however I see that the attribute is being updated. this.template.querySelector('#'+event.target.id).setAttribute(...
1
vote
1answer
246 views

Dynamically set the onclick function in LWC button

I'm trying to dynamically set the onclick function of lightning web component button but it's not working. I've tried both "click" and "onclick" JS: const navButton = this.template.querySelector('....
5
votes
2answers
301 views

How to run “ $('div').clone().appendTo('.wrapper'); ” in LWC? [closed]

I want to achieve this in LWC. I want to call the same HTML content (ex- div, p) multiple times in iteration & append them one below other as shown in above link. I used this $('div').clone()....
2
votes
1answer
63 views

LWC + Jest: Make assertions about an element's rendered style

In a LWC project, I'm setting certain child component style properties from the parent component. I want to test that an element in a child component shows up with those properties when it's rendered,...
1
vote
1answer
315 views

LWC: unit testing component using validity object

I have an lwc component which validates some input fields before performing a post request to the server. I'm writing a unit test where I'm testing that the post request is called when all input ...
0
votes
1answer
206 views

How to set typeattribute in LWC datatable?

{label:'FCU Trigger', type: "button", typeAttributes: { label: 'Initiate', name: 'initiate', ...
5
votes
2answers
235 views

Clarification on what this.template.querySelectorAll lets you see in LWCs: want to modify field labels

I have a form rendered using just a lightning-record-form - very cool to get so much done by this single LWC (Lightning Web Component). But I'm trying to replace the labels with the inline help text ...
0
votes
0answers
160 views

How to use jQuery Datatable in Lightning Web Component?

I was trying to get jQuery Datatables work in my LWC. I have tried this: LWC is it Possible to Load the JQuery Plugin Datatables in a Lightning Web Component? But I was not able to get it work. ...
2
votes
0answers
88 views

Highlight modified fields in LWC

I have a complex UI that renders multiple <lightning-input> fields. When the user edits these fields, I store the originalValue (usually passed through an @api property), the newValue and the ...
1
vote
2answers
504 views

Dynamically change color of text/numbers in LWC?

I want to change values of text/numbers dynamically depending upon certain conditions. (3 colors - Red, Yellow, Green) So like depending upon value of numbers (like if its greater than 10 i want to ...
0
votes
1answer
629 views

Empty check in LWC html

How to do empty check like we used to do in Aura bundle <aura:if isTrue="{!not(empty(v.opportunityList))}"> I have a datatable in the lwc and want do display a message when no data to display ...
1
vote
2answers
387 views

Unable to save on handleSubmit in a lightning-record-edit-form component

I'm having an issue trying to save a record I'm creating using LWC. I have a "lightning-record-edit-form component" tag with its "onsubmit" and "onsuccess". Both execute properly if I let them do ...
0
votes
1answer
793 views

How to change CSS of a lightning-accordion-section label in Lightning Web Component [duplicate]

I can't change the CSS of the accordion title because of the shadow DOM in lwc. Is there any way to accomplish that? Here is the code: <lightning-accordion onsectiontoggle={handleToggleSection} ...
0
votes
0answers
67 views

Finding out when lightning-record-form has finished rendering?

I have a LWC which displays the Compact Layout as a popup in a graph using lightning-record-form. The LWC holds a <slot> in which the popup-lwc has the record for like so. <template> &...
1
vote
0answers
165 views

HTML5 canvas gradients in LWC are all black

I'm trying to create a HTML5 canvas with a simple gradient in LWC. However, it's all black. The code I'm trying is almost completely copied from W3C (except it's adjusted for LWC). HTML <template&...
0
votes
1answer
334 views

Show parent field in LWC

I have a wizard on case object. The idea is to help agents to fill up the necessary data. however, I have trouble to show parent field (i.e Account.Name) in LWC HTML file. Here is my code Controller ...
0
votes
0answers
93 views

LWC Routing using Navigo ; Getting Error ->e.replace is not a function

<template for:each={menuItems} for:item="menuItem"> <li key={menuItem.location} class="menu-item" href={menuItem.location} onclick={handleMenuItemClick}> ...
0
votes
1answer
334 views

Unable to apply css in LWC

Below css not applying to my lwc map component. How to apply css to slds-coordinates? I see it's working in aura. How to apply the same to lwc? Scrollable Footer in lightning:map css .slds-...
1
vote
1answer
767 views

Variant label-hidden with Lightning Input Field and LWC not hiding HelpText Icon? [duplicate]

I've seen various posts about how you cab hide stray elements like this with aura components, and I think the answer with LWC is always 'shadow-dom' as described here but is there really no way to ...
0
votes
3answers
137 views

LWC - could not load __mocks__/sampledata (imported by root/app/app.js): request failed

I have a requirement where I want to utilize the tree-grid LWC component. The sample example provided in the Component reference guide by the Salesforce for the same is not working. I'm getting the ...
2
votes
1answer
652 views

Keypress ESC in LWC

I'm looking to add a listener for key "ESC" pressed during interaction with a modal to close it. Because of DOM containment, it seems that I should NOT be using window or document to add a listener ...
2
votes
1answer
861 views

Dynamically adding read-only attribute to lightning-input element in lwc framework

Based on the selection of a radio button, I would like to toggle the read-only attribute of lightning-input element. setAttribute method on DOM element doesn't seem to work. app.html <template&...
1
vote
0answers
465 views

LWC: Using lwc:dom=“manual” to reach and interact with a certain DOM element

I am trying to find a way to interact with the built-in chat widget. I need to simulate a click on it. I understand that the Locker Service is there to prevent any interaction outside of the DOM of ...