Retrieve data of Cross-object(Lookup/Master-Detail) from child to parent for custom objects and navigate to record detail page in lightning component Salesforce | How to fetch data of Cross object using SOQL query in salesforce

Hey guys, today in this post we are going to learn about How retrieve data of Cross-object(Lookup/Master-Detail) from child to parent for custom objects and navigate to record detail page in lightning component Salesforce.

Don’t forget to check out:- How to write a Cross-object (Nested Queries) SOQL query from Parent to child Click Here For More Information.

Files we used in this post example

childParentCmp.cmp	Lightning Component	It is used for create a table for display the related list Values from child to Parent
childParentCmpController.js	JavaScript Controller File	It is hold Javascript doInit and navigate functionality to navigate on sObject record.
childParentCmpHelper.js	JavaScript Controller Helper File	It is hold for Javascript Helper Function Communicate to Related Queries Values (Child to Parent) from apex method
childParentCmpCtrl.apxc	Apex Class Controller	It is used for get SOQL query from Child to Parent from Apex Method

Live Demo

You can download file directly from github by Click Here.

👉 Download Free Ebook →

👉 Get Free Course →

Why Should You Schedule Meeting?

🎯 If You Are Facing Any Of These 6 Challenges. Schedule Meeting With Me.

Learn Salesforce Development
Career Confusion
No Interview Call
Low Salary
No Promotion/Growth
No Finding New Job Opportunity
Why you stucking from past so many years in same company?

Other related post that would you like to learn in Salesforce

Create Lightning Component

Step 1:- Create Lightning Component : childParentCmp.cmp

From Developer Console >> File >> New >> Lightning Component

childParentCmp.cmp [Lightning Component File]

   <aura:component controller="childParentCmpCtrl" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >

	<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

    <aura:attribute name="carAryList" type="carModel__c[]"/>

```
 
```

    <div class="slds slds-p-around--medium">

```
          <div>
```

             <table class="slds-table slds-table_bordered slds-table_cell-buffer" style="border:1px #ddd solid;">

```
                <thead>
```

                    <tr class="slds-text-title_caps">

                        <th>Car Maker</th>

                        <th>Car Model</th>

                        <th>Regiser User</th>

                        <th>Country</th>

```
                        <th>Phone</th>
```
```
                        <th>State</th>
```
```
                    </tr>
```
```
                </thead>     
```
```
                <tbody>
```

                  <aura:iteration items="{!v.carAryList}" var="item">

```
                   <tr>
```

                        <td id="modelName"><a data-recId="{!item.Id}" href="" onclick="{!c.navigate}" >{!item.lookup_relation__r.Name}</a></td>

                        <td>{!item.Name}</td>

                        <td>{!item.car_model_master_rel__r.User_Name__r.Name}</td>

                        <td>{!item.car_model_master_rel__r.Country__c}</td>

                        <td>{!item.car_model_master_rel__r.Phone__c}</td>

                        <td>{!item.car_model_master_rel__r.state__c}</td>

```
                    </tr>
```
```
                   </aura:iteration>   
```
```
                </tbody>
```
```
            </table>
```
```
        </div>
```
```
 
```
```
 <br/><br/>
```
```
   
```

<div style="border:1px #ddd solid; padding:10px; background:#eee; margin:40px 0;">

```
 
```

            <p data-aura-rendered-by="435:0"><img src="https://www.w3web.net/wp-content/uploads/2021/05/thumbsUpLike.png" width="25" height="25" style="vertical-align:top; margin-right:10px;" data-aura-rendered-by="436:0"><strong data-aura-rendered-by="437:0"><span style="font-size:16px; font-style:italic; display:inline-block; margin-right:5px;">Don't forget to check out:-</span><a href="https://www.w3web.net/" target="_blank" rel="noopener noreferrer" style="text-decoration:none;" data-aura-rendered-by="440:0">An easy way to learn step-by-step online free Salesforce tutorial, To know more Click  <span style="color:#ff8000; font-size:18px;" data-aura-rendered-by="442:0">Here..</span></a></strong></p>

```
 
```
```
            <br/><br/>
```

            <p data-aura-rendered-by="435:0"><img src="https://www.w3web.net/wp-content/uploads/2021/07/tickMarkIcon.png" width="25" height="25" style="vertical-align:top; margin-right:10px;" data-aura-rendered-by="436:0"><strong data-aura-rendered-by="437:0"><span style="font-size:17px; font-style:italic; display:inline-block; margin-right:5px; color:rgb(255 128 0);">You May Also Like →</span> </strong></p>

            <div style="display:block; overflow:hidden;">

                <div style="width: 50%; float:left; display:inline-block">

                    <ul style="list-style-type: square; font-size: 16px; margin: 0 0 0 54px; padding: 0;">

                        <li><a href="https://www.w3web.net/lwc-get-set-lightning-checkbox-value/" target="_blank" rel="noopener noreferrer">How to get selected checkbox value in lwc</a></li>

                        <li><a href="https://www.w3web.net/display-account-related-contacts-in-lwc/" target="_blank" rel="noopener noreferrer">how to display account related contacts based on AccountId in lwc</a></li>

                        <li><a href="https://www.w3web.net/create-lightning-datatable-row-actions-in-lwc/" target="_blank" rel="noopener noreferrer">how to create lightning datatable row actions in lwc</a></li>

                        <li><a href="https://www.w3web.net/if-and-else-condition-in-lwc/" target="_blank" rel="noopener noreferrer">how to use if and else condition in lwc</a></li>

                        <li><a href="https://www.w3web.net/get-selected-radio-button-value-and-checked-default-in-lwc/" target="_blank" rel="noopener noreferrer">how to display selected radio button value in lwc</a></li>

```
                    </ul>
```
```
            </div>
```
```
 
```

            <div style="width: 50%; float:left; display:inline-block">

                    <ul style="list-style-type: square; font-size: 16px; margin: 0 0 0 54px; padding: 0;">

                        <li><a href="https://www.w3web.net/display-account-related-contacts-lwc/" target="_blank" rel="noopener noreferrer">display account related contacts based on account name in lwc</a></li>

                        <li><a href="https://www.w3web.net/create-lightning-datatable-row-actions-in-lwc/" target="_blank" rel="noopener noreferrer">how to insert a record of account Using apex class in LWC</a></li>

                        <li><a href="https://www.w3web.net/fetch-picklist-values-dynamic-in-lwc/" target="_blank" rel="noopener noreferrer">how to get picklist values dynamically in lwc</a></li>

                        <li><a href="https://www.w3web.net/edit-save-and-remove-rows-dynamically-in-lightning-component/" target="_blank" rel="noopener noreferrer">how to edit/save row dynamically in lightning component</a></li>

                        <li><a href="https://www.w3web.net/update-parent-object-from-child/" target="_blank" rel="noopener noreferrer">update parent field from child using apex trigger</a></li>

```
                    </ul>
```
```
                </div>
```

               <div style="clear:both;"></div>

```
               <br/>
```

                <div class="youtubeIcon">

                    <a href="https://www.youtube.com/channel/UCW62gTen2zniILj9xE6LmOg" target="_blank" rel="noopener noreferrer"><img src="https://www.w3web.net/wp-content/uploads/2021/11/youtubeIcon.png" width="25" height="25" style="vertical-align:top; margin-right:10px;"/> <strong>TechW3web:-</strong> To know more, Use this <span style="color: #ff8000; font-weight: bold;">Link</span> </a>

```
                </div>
```
```
    </div>
```
```
 
```
```
</div>
```
```
 
```
```
  
```
```
 
```
```
    </div>
```
```
</aura:component>
```

Create Component JavaScript Controller

Step 2:- Create Lightning Component : childParentCmpController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

childParentCmpController.js [JavaScript Controller]

```
   ({
```

	doInit : function(component, event, helper) {

```
		helper.childParentHelper(component); 
```
```
	},
```
```
 
```

     navigate:function(component, event, helper){

        var record = event.currentTarget.getAttribute("data-recId");

```
       // alert(record);
```

        var carMdlName = component.get('v.carAryList')

        //var record = event.getSource().get("v.id");

```
        console.log('====='+record);
```

        var sObectEvent = $A.get("e.force:navigateToSObject");

```
        sObectEvent.setParams({
```

            "recordId":  record

```
            //"slideDevName": "detail"
```
```
        });
```
```
        sObectEvent.fire(); 
```
```
    },
```
```
 
```
```
})
```

Create Component JavaScript Helper

Step 3:- Create Lightning Component : childParentCmpHelper.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Helper

childParentCmpHelper.js [JavaScript Helper File]

```
  ({
```

	childParentHelper : function(component, event, helper) {

        var action = component.get('c.carModelFetch');

```
        action.setParams({
```

            "carModelId" : component.get("v.recordId")

```
        });
```

        action.setCallback(this, function(response) {

            var state = response.getState();

            if (state === "SUCCESS") {

                var results = response.getReturnValue();

                var lookupList = JSON.stringify('stringItems' + results);

                component.set("v.carAryList",results);

```
            }
```
```
        }); 
```
```
 
```
```
        $A.enqueueAction(action);
```
```
    },
```
```
})
```

Create Apex Class Controller

Step 4:- Create Apex Class : childParentCmpCtrl.apxc

From Developer Console >> File >> New >> Apex Class

childParentCmpCtrl.apxc [Apex Class Controller]

```
   public class childParentCmpCtrl {
```
```
 
```
```
    //Child TO parent 
```
```
    @AuraEnabled 
```

    public static List<carModel__c> carModelFetch( Id carModelId){

        system.debug('carModelId::  '+carModelId);

        List<carModel__c> carList = [SELECT id, Name,lookup_relation__c, lookup_relation__r.Name, car_model_master_rel__r.Country__c,

                                     car_model_master_rel__r.Phone__c, car_model_master_rel__r.state__c,

                                     car_model_master_rel__r.User_Name__r.name FROM carModel__c WHERE id=:carModelId];

        system.debug('carList::#  '+carList);

```
        RETURN carList;
```
```
    }
```
```
 
```
```
}
```

TechW3web:- To know more, Use this Link

Further post that would you like to learn in Salesforce

The Sitemap to Find all Published Post of The Tutorial w3web.net Click Here For More Information

FAQ (Frequently Asked Questions)

What is lookup and master detail relationship in Salesforce?

Lookup and Master-detail both are types of relationships. In lookup, both objects are not sharing properties between them means loosely coupled. In Master-detail, both objects are sharing properties with each other means tightly coupled.

Can we convert master detail to lookup in Salesforce?

Yes, We can Convert Master Detail Relationship into Lookup.

What is difference between master-detail and lookup?

The Salesforce lookup relationship has no relation with other records. It does not depend on any other objects, whereas a master-detail relationship has an association with other records. On the other hand, the lookup relationship is just a reference. It can be even blank or NULL.

Vijay Kumar

Hi, This is Vijay Kumar behind the admin and founder of w3web.net. I am a senior software developer and working in MNC company from more than 8 years. I am great fan of technology, configuration, customization & development. Apart of this, I love to write about Blogging in spare time, Working on Mobile & Web application development, Salesforce lightning, Salesforce LWC and Salesforce Integration development in full time. [Read full bio] | | The Sitemap where you can find all published post on w3web.net