Created
October 8, 2019 10:06
-
-
Save vermadhirendra28/913d410b941a47e51c4eff805d6616ed to your computer and use it in GitHub Desktop.
Gist for displaying parent values on lightning datatable using wrapper class
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
*A class to display the value of the parent field on the standard lightning datatable using wrapper. | |
**/ | |
public class DisplayParentFieldValCont{ | |
/** | |
*@Desc: A method to fetch details of parent record | |
**/ | |
@AuraEnabled | |
public static map<String,Object> getParentDetails(){ | |
map<String,Object> mapData = new map<String,Object>(); | |
list<DataWrapper> listContact = new list<DataWrapper>(); | |
for(Contact objContact : [Select Id, Account.Name, | |
Account.Description, | |
Name,firstName,lastname | |
from Contact | |
Where AccountId <> NULL limit 5]){ | |
if(objContact.Account.Description <> NULL){ | |
listContact.add(new DataWrapper(objContact.Account.Name,objContact.Name, | |
objContact.Account.Description)); | |
} | |
} | |
mapData.put('ParentDetails',JSON.serialize(listContact)); | |
return mapData; | |
} | |
//A wrapper class that will be use do display the data of the object | |
public class DataWrapper{ | |
@AuraEnabled public String strParentName {get;set;} | |
@AuraEnabled public String strChildName {get;set;} | |
@AuraEnabled public String strParentDesc {get;set;} | |
public DataWrapper(String p_strParentName, | |
String p_strChildName, | |
String p_strParentDesc){ | |
this.strParentName = p_strParentName; | |
this.strChildName = p_strChildName; | |
this.strParentDesc = p_strParentDesc; | |
} | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** lightning component code***/ | |
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" | |
access="global" controller="DisplayParentFieldValCont"> | |
<aura:attribute name="listRecords" type="list" /> | |
<aura:attribute name="listCol" type="list" /> | |
<!-- aura helper methods --> | |
<aura:handler name="init" value="{!this}" action="{!c.init}" /> | |
<!-- the container element determine the height of the datatable --> | |
<div class="slds-page-header"> | |
<article class="slds-card"> | |
<div class="slds-card__header slds-grid"> | |
<header class="slds-media slds-media_center slds-has-flexi-truncate"> | |
<div class="slds-media__figure"> | |
<span class="slds-icon_container slds-icon-standard-account" title="contact"> | |
<lightning:icon iconName="utility:contact" size="medium"/> | |
<span class="slds-assistive-text">Contact Details</span> | |
</span> | |
</div> | |
<div class="slds-media__body"> | |
<h2 class="slds-card__header-title"> | |
<a href="javascript:void(0);" class="slds-card__header-link slds-truncate" title="Accounts"> | |
<span>Display contact parent fields value using wrapper</span> | |
</a> | |
</h2> | |
</div> | |
</header> | |
</div> | |
<div class="slds-card__body slds-card__body_inner"> | |
<lightning:datatable | |
keyField="id" | |
data="{!v.listRecords}" | |
columns="{!v.listCol}" | |
hideCheckboxColumn="true"/> | |
</div> | |
</article> | |
<div style="padding-top:2%;text-align:center"> | |
</div> | |
</div> | |
</aura:component> | |
/** lightning component controller**/ | |
({ | |
init : function(component, event, helper) { | |
helper.getData(component,event); | |
} | |
}) | |
/** lightning component helper **/ | |
({ | |
getData : function(component,event) { | |
var columnslist =[ | |
{label: 'Parent AccountName', fieldName: 'strParentName', type: 'text'}, | |
{label: 'Child Contact Name', fieldName: 'strChildName', type: 'text'}, | |
{label: 'Parent AccountDesc', fieldName: 'strParentDesc', type: 'text'}]; | |
var self = this; | |
var fetchDataAction = component.get("c.getParentDetails"); | |
self.serverSideCall(component,fetchDataAction).then( | |
function(responseData){ | |
var fetchedData = JSON.parse(responseData.ParentDetails); | |
console.log(fetchedData); | |
component.set("v.listRecords",fetchedData); | |
component.set("v.listCol",columnslist); | |
} | |
).catch(function(error){ | |
console.log('errod recieved***'+error); | |
}); | |
}, | |
/** | |
* Inclusion of Promise then to handle the response recieved from controller in a more appropriate way | |
**/ | |
serverSideCall : function(component,action) { | |
return new Promise(function(resolve, reject) { | |
action.setCallback(this, | |
function(response) { | |
var state = response.getState(); | |
if (state === "SUCCESS") { | |
var result = response.getReturnValue(); | |
resolve(result); | |
} else { | |
reject(new Error(response.getError())); | |
} | |
}); | |
$A.enqueueAction(action); | |
}); | |
}, | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment