You need to sign in to do that
Don't have an account?

Unable to display Related list in Lightning Component
COMPONENT
_____________
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" controller="accClass">
<aura:attribute name="data" type="List"/>
<aura:attribute name="columns" type="List"/>
<aura:handler name="init" value="{! this }" action="{! c.doInit }"/>
<aura:attribute name="id1" type="id" />
<lightning:navigation aura:id="navigate"/>
<aura:attribute name="truthy" type="Boolean" Default ="true"/>
<table class="slds-table slds-table--bordered slds-table--cell-buffer">
<thead>
<tr class="slds-text-title--caps">
<th scope="col">
<div class="slds-truncate" title="Name">Name</div>
</th>
<th scope="col">
<div class="slds-truncate" title="Id">Id</div>
</th>
<th scope="col">
<div class="slds-truncate" title="AccountNumber">AccountNumber</div>
</th>
</tr>
</thead>
<tbody>
<aura:iteration items="{!v.data}" var="ct">
<tr>
<th scope="row" data-label="First Name">
<div class="slds-truncate" title="{! ct.Name }">{! ct.Name }</div>
</th>
<td data-label="Last Name">
<div class="slds-truncate" title="{! ct.Id }">{! ct.Id }</div>
</td>
<td data-label="Email">
<div class="slds-truncate" title="{! ct.AccountNumber }">{! ct.AccountNumber }</div>
</td>
<td>
<lightning:button name="{!ct.Id}" variant="brand" label="Related_Contacts" onclick="{! c.showCon }" />
</td>
</tr>
</aura:iteration>
</tbody>
</table>
</aura:component>
CONTROLLER.JS
________________
({
doInit : function(component, event, helper)
{
var accRecord = component.get('c.sendAccount');
accRecord.setParams({
});
accRecord.setCallback(this,function(response){
var state = response.getState();
if(state==='SUCCESS')
{
var response = response.getReturnValue();
console.log(response);
component.set("v.data" , response);
}
});
$A.enqueueAction(accRecord);
},
showCon: function (component, event, helper)
{
var recId = event.getSource().get('v.name');
var relatedListEvent = $A.get("e.force:navigateToRelatedList");
relatedListEvent.setParams({ "relatedListId": "contact",
"parentRecordId": recId });
relatedListEvent.fire();
}
});
After clicking the related contact button this error is shown
_____________
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" controller="accClass">
<aura:attribute name="data" type="List"/>
<aura:attribute name="columns" type="List"/>
<aura:handler name="init" value="{! this }" action="{! c.doInit }"/>
<aura:attribute name="id1" type="id" />
<lightning:navigation aura:id="navigate"/>
<aura:attribute name="truthy" type="Boolean" Default ="true"/>
<table class="slds-table slds-table--bordered slds-table--cell-buffer">
<thead>
<tr class="slds-text-title--caps">
<th scope="col">
<div class="slds-truncate" title="Name">Name</div>
</th>
<th scope="col">
<div class="slds-truncate" title="Id">Id</div>
</th>
<th scope="col">
<div class="slds-truncate" title="AccountNumber">AccountNumber</div>
</th>
</tr>
</thead>
<tbody>
<aura:iteration items="{!v.data}" var="ct">
<tr>
<th scope="row" data-label="First Name">
<div class="slds-truncate" title="{! ct.Name }">{! ct.Name }</div>
</th>
<td data-label="Last Name">
<div class="slds-truncate" title="{! ct.Id }">{! ct.Id }</div>
</td>
<td data-label="Email">
<div class="slds-truncate" title="{! ct.AccountNumber }">{! ct.AccountNumber }</div>
</td>
<td>
<lightning:button name="{!ct.Id}" variant="brand" label="Related_Contacts" onclick="{! c.showCon }" />
</td>
</tr>
</aura:iteration>
</tbody>
</table>
</aura:component>
CONTROLLER.JS
________________
({
doInit : function(component, event, helper)
{
var accRecord = component.get('c.sendAccount');
accRecord.setParams({
});
accRecord.setCallback(this,function(response){
var state = response.getState();
if(state==='SUCCESS')
{
var response = response.getReturnValue();
console.log(response);
component.set("v.data" , response);
}
});
$A.enqueueAction(accRecord);
},
showCon: function (component, event, helper)
{
var recId = event.getSource().get('v.name');
var relatedListEvent = $A.get("e.force:navigateToRelatedList");
relatedListEvent.setParams({ "relatedListId": "contact",
"parentRecordId": recId });
relatedListEvent.fire();
}
});
Hi,
The issue is exactly what the error says, that is you cannot display a related list if it's not placed in the layout.
Read this article for details: https://help.salesforce.com/articleView?id=000320285&type=1&mode=1 (https://help.salesforce.com/articleView?id=000320285&type=1&mode=1)
All Answers
Hi,
The issue is exactly what the error says, that is you cannot display a related list if it's not placed in the layout.
Read this article for details: https://help.salesforce.com/articleView?id=000320285&type=1&mode=1 (https://help.salesforce.com/articleView?id=000320285&type=1&mode=1)
Pawel Borys