New answers tagged

0

thanks for the help and advice i got to the bottom of it, in summary we were using the wrong aria control !! aria-controls="{!PQs.AnswerID + '-listbox-searchresults'}" should be ariaControls="{!PQs.AnswerID + 'LkupRslt'}"/> the whole piece looks like this <lightning:input id="{!PQs.AnswerID}" ...


0

i observed your code used aura:renderIf i am Not sure if this would apply in your scenario in iteration , but have you tried using aura:if instead of aura:renderIf? because library doc. it's Deprecated. Use aura:if instead. This component allows you to conditionally render its contents. It renders its body only if isTrue evaluates to true. The else ...


0

This is a nice and clear example of how to activate/deactivate tabs: https://sfdcmonkey.com/2016/11/23/how-to-create-lightning-tabs-in-component/


0

If you are uploading the SLDS files to support Visualforce development, such as creating a Visualforce Page (VFP) for a Force.com Site, you can just reference the SLDS tag in the VFP: <apex:page > <apex:slds /> // addition page apex/html markup </apex:page> Check out: https://developer.salesforce.com/docs/atlas.en-us.pages.meta/...


0

I ended up using NavigationMixin to resolve this using recommendation from @n30r3b3l. Also removed href={account.Url} myApp.html <template> <!-- other code --> <template for:each={myAccounts} for:item="account"> <div key={account.id} class="slds-col"> <lightning-tile label={...


2

It looks like you are attempting to do an expression evaluation in the markup, which I don't think is supported in LWC at this time. You will likely need to do something like myApp.js import { LightningElement, track } from 'lwc'; export default class App extends LightningElement { @track myAccounts = [ { "Id": "1", "Name": "Abc Inc.", ...


0

Change "/assets" to "/_slds" in the use element. <use xlink:href="/_slds/icons/standard-sprite/svg/symbols.svg#comments"></use>


2

you can define custom properties either in components to make them local or load them from StaticResource, if they are not already present on the page. Salesforce by default loads its' properties in :root, but you can't use :root in LWC components. So if you want to make property component-specific use something like this. /* CSS */ :host { --bgColor: ...


2

There are two locations, one for Lightning, and one for Visualforce. Lightning Replace the /assets/ of any URL in the Lightning Design System with /_slds/. Example: /_slds/icons/utility-sprite/svg/symbols.svg#search Note: It is strongly recommended that you simply use lightning:icon, lightning:buttonIcon, etc, when using SLDS in a supported environment. ...


0

The number of columns available in the responsive grid is 1,2,3,4,5,6,7,8 and 12. So, 1-of-9 is not going to get a width. You can learn more in the blueprint documentation: https://www.lightningdesignsystem.com/utilities/grid/


1

I am not entirely sure I understand your question, so thank you for your patience if I miss the mark. The Design Guidelines provide design principles for creating or implementing charts. They do not provide the actual code or functionality.


0

Try using $('lightning-helptext').style.display = 'none'; within an external js file, loading within renderedCallback function through loadScript as described in this documentation: https://developer.salesforce.com/docs/component-library/documentation/lwc/create_third_party_library (if this works, it would hide ALL help text icons on the page, including ...


0

here is a nice approach to this problem <!--cmp.html--> ... <tr data-id={row.id} onchange={handleChange}> ... <td><lightning-input name="Name" value={row.name}></lightning-input></td> <td><lightning-input name="Age" value={row.age}></lightning-input></td> </tr> ... // cmp.js // ... ...


1

In HTML you are providing the Id of the record in data-id attribute, similarly, you can provide the API Name of the field in the "name" attribute so that in handleChange handler you can update the specific field of the specific record in your myList. In js : handleChange(event) { console.log(event.target.name); //... Field API Name ...


1

Use a lightning:layout. It supports 12 columns, so you might choose to split them such as 4-8 or 3-9 (etc) to suit your needs. <lightning:layout> <lightning:layoutItem size="4"> <c:component1/> </lightning:layoutItem> <lightning:layoutItem size="8"> <c:component2/> <c:component3/> </lightning:...


0

I've run into the same issue. It appears the styling for <lightning-card> may be broken at this time with LWC. What you can do is simply add a class onto the card and give it a style of display: block. So in your .html file: <lightning-card title="parent" class="my-card"></lightning-card> And in a .css file: .my-card { display: ...


4

If you add an aura:id to your input field, you can access the input element in javaScript Controller:- <lightning:input aura:id="inputCmp" type="number" value="{!v.value1}" /> In the controller, you can access the type of the input field as below:- var inputCmp = component.find("inputCmp"); var type = inputCmp.get("v.type");


Top 50 recent answers are included