0

I'm creating a table by looping a list of Events (inside the html file of the LWC) and need to populate its rows with values that aren't directly stored in the Event object. More specifically, there is a column named "Contacts" that has to display a picklist containing all of the contacts linked to the related account (Event -> Account -> Contact). I have written a basic method inside my Apex controller and I have figured out how to send the Event.WhatId as a parameter of that same method, but I'm failing to understand how all the different rows can populate dynamically.

Please check below code for more info:

.html

<template for:each={recordList} for:item="event">
    <tr class="slds-hint-parent" key={event.WhatId}>
        <td>
            <div class="slds-truncate" title="Account-Name-Row">{event.Account.Name}</div>
        </td>
        <td>
            <div class="slds-truncate" title="Contacts-Row">
                <lightning-combobox>
                ???
                </lightning-combobox>
            </div>
        </td>
        <td>
            <div class="slds-truncate" title="City-Row">{event.Account.BillingCity}</div>
        </td>
        <td>
            <div class="slds-truncate" title="Start-Date-Row">
                <lightning-input type="date"
                                 name="event-start-date"
                                 onchange={handleEventStartChange}>
                </lightning-input>
            </div>
        </td>
        <td>
            <div class="slds-truncate" title="End-Date-Row">
                <lightning-input type="date"
                                 name="event-end-date"
                                 onchange={handleEventEndChange}>
                </lightning-input>
            </div>
        </td>
    </tr>
</template>

.cls

@AuraEnabled(Cacheable=true)
public static List <Contact> getContacts (String acctId)
{
    List <Contact> contList = [SELECT Name FROM Contact WHERE AccountId = :acctId];
    return contList;
}

1 Answer 1

0

You just need to provide the value (an Id) and the list of possible values (arranged as {value,label} pairs). The relevant wired method would be:

contactOptions = [];
@wire(getContacts,{acctId: '$recordId'})
wireContactResponse({data,error}) {
  if(data) {
    this.contactOptions = data.map(record => ({ value: record.Id, label: record.Name }));
    this.error = null;
  }
  if(error) {
    this.contactOptions = [];
    this.error = error;
  }
}

And in your markup:

<lightning-combobox label="Contact" options={contactOptions} value={event.WhoId}>
</lightning-combobox>
2
  • Hey, thanks a lot for your help! I have used your code but, unfortunately, it's not working since the picklist isn't showing any value. I've also put a console.log right before and after the call to the apex method and nothing showed up. Commented May 17, 2021 at 12:38
  • @antoinedoinel You need to provide a recordId value. I don't have enough code from your question to figure out how to make that happen, but that's the piece you're likely missing. See Understand the Wire Service for more information.
    – sfdcfox
    Commented May 17, 2021 at 13:11

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .