function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
rahul tiwari 110rahul tiwari 110 

How to display account and i's contact in wrapper class in lightning?

Hi everyone, I m new to lightning and wanted to show accounts and their contacts in a wrapper class by lightning component, whenever an account is clicked it should show its related contacts under the account name.
can anyone pls help me with it
Thanks 
Best Answer chosen by rahul tiwari 110
Suraj Tripathi 47Suraj Tripathi 47
Hi,

I have solved the issue and it is working fine.

Declare this attribute on your component:-
 <aura:attribute name="conWrapperList" type="object"/> 

Now, on helperGetDetail method set :-    component.set('v.conWrapperList',response.getReturnValue());

Now on iteration of contacts change with this code :-  
 <lightning:select label="contact list" >

  <aura:iteration items="{!v.conWrapperList.conList}" var="con"> 
        <option label="{!con.Name}" value="{!con.Id}"/>  
    </aura:iteration> 
   </lightning:select>​​​​​​​


Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi


 

All Answers

Suraj Tripathi 47Suraj Tripathi 47
Hi,

Please follow the code:- 
<!--      AURA Comonent   -->

<aura:component controller="AccountApex" 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="accountList" type="list"/>
    <aura:attribute name="selectedAccount" type="account"/>
    <aura:attribute name="contactList" type="list"/>
   
    <lightning:select name="selectItem" label="Select Account" aura:id="ac" onchange="{!c.getDetail}" >
        <aura:iteration items="{!v.accountList}" var="acc">
            <option label="{!acc.Name}" value="{!acc.Id}" />
        </aura:iteration>
    </lightning:select>
    
    <lightning:select label="contact list" >
    <aura:iteration items="{!v.contactList}" var="con">
        <option label="{!con.LastName}" value="{!con.Id}"/>  
    </aura:iteration> 
   </lightning:select>
    
    
</aura:component>


//   CONTROLLER
({
    doInit : function(component, event, helper) {
        helper.getAllAccount(component, event, helper);
    },
    
    getDetail: function(component, event, helper){
        helper.helperGetDetail(component, event, helper);
    }  
})

//    HELPER

({
getAllAccount : function(component, event, helper) {
        var action=component.get('c.fetchAccount');
        action.setCallback(this,function(response){
           console.log('response===>  '+JSON.stringify(response.getReturnValue()));
            if(response.getReturnValue()!=null){
                console.log('success');
                component.set('v.accountList',response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },   
    
        helperGetDetail: function(component, event, helper){
        var acid=component.find('ac').get('v.value');
        console.log(acid);
        var action=component.get('c.getContact');
        action.setParams({
            accid:acid
        });
         action.setCallback(this,function(response){
           console.log('response===>  '+JSON.stringify(response.getReturnValue()));
            if(response.getReturnValue()!=null){
                console.log('success');
                component.set('v.contactList',response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
    
   
})


// APEX
public class AccountApex {

  @Auraenabled
    public static List<account> accountList{get; set;} 
	 @Auraenabled
        public List<contact> contactList{get; set;}
    @Auraenabled
    public static WrapperAccount wrapperInstance{get; set;}
    
    
    @Auraenabled
    public static WrapperAccount fetchAccount(){
       wrapperInstance = new WrapperAccount();
         accountList = new List<account>();
        try{
            
        for(Account accountInstance: [Select Id,Name,Phone from Account WITH SECURITY_ENFORCED]){
            accountList.add(accountInstance);
        }
            wrapperInstance.accList = accountList;
            wrapperInstance.message = 'No Error';
            wrapperInstance.isSuccess = true;
            
        
        }
        catch(exception e){
            System.debug('error--> '+e.getMessage()+' at ling no--> '+e.getLineNumber());
            wrapperInstance.accList = accountList;
            wrapperInstance.message = e.getMessage();
            wrapperInstance.isSuccess = false;
        }
          return wrapperInstance;
    }
	
	 @Auraenabled
    public static WrapperAccount getContact(id accid){
       wrapperInstance = new WrapperAccount();
         contactList = new List<contact>();
        try{
            
        for(Contact accountInstance: [Select Id,Name,Phone from contact where accountid =:accid]){
            contactList.add(accountInstance);
        }
            wrapperInstance.conList = contactList;
            wrapperInstance.message = 'No Error';
            wrapperInstance.isSuccess = true;
            
      
        }
        catch(exception e){
            System.debug('error--> '+e.getMessage()+' at ling no--> '+e.getLineNumber());
            wrapperInstance.accList = contactList;
            wrapperInstance.message = e.getMessage();
            wrapperInstance.isSuccess = false;
        }
          return wrapperInstance;
    }
    
    
    public class WrapperAccount{
        @Auraenabled
        public List<Account> accList{get; set;}
		
		 @Auraenabled
        public List<contact> conList{get; set;}
		
        @Auraenabled
        public Boolean isSuccess{get; set;}
        @Auraenabled
        public String message{get; set;}
        
    }
	}

Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi
rahul tiwari 110rahul tiwari 110
Hello sir,
thanks for the solution, but i m facing an error in class it is giving that contactList variable does not exist while it has been given in getContact method, I tried to wrote it in fetchaccount method but got the same error .
can u pls help me?
Thank sin advance
Suraj Tripathi 47Suraj Tripathi 47
Hi,

Are you getting data from the apex class? Debug each step to know in which line and class you are getting errors. If you are getting data from apex class then in aura component change this:-

// declare this attribute
 <aura:attribute name="wrapperList" type="object"/> 

While iterating account
getAllAccount helper =  component.set('v.wrapperList',response.getReturnValue());

 <aura:iteration items="{!v.wrapperList.accList}" var="acc">

same for contact List:- 

in helperGetDetail helper =  component.set('v.wrapperList',response.getReturnValue());

 <aura:iteration items="{!v.wrapperList.conList}" var="con">


Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi
rahul tiwari 110rahul tiwari 110
Hi sir,I m not even able to save the class,below is the screen shot
User-added image
rahul tiwari 110rahul tiwari 110
By making contact list static it gives the below error
User-added image
Suraj Tripathi 47Suraj Tripathi 47
Hi,

At the top of your code update contact List with:- 
@Auraenabled
 public static List<contact> contactList{get; set;}

and in getContact method inside catch change this:- 
 catch(exception e){
            System.debug('error--> '+e.getMessage()+' at ling no--> '+e.getLineNumber());
            wrapperInstance.conList = contactList;
            wrapperInstance.message = e.getMessage();
            wrapperInstance.isSuccess = false;
        }

after changing this plz apply the changes that I have mentioned in my previous reply.

Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi
rahul tiwari 110rahul tiwari 110
User-added image
helper getallaccount  & getdetail
User-added image

bust still not able to save the class
User-added image
Suraj Tripathi 47Suraj Tripathi 47
Hi,
In line 52 pls  change :-  wrapperInstance.conList = contactList;

Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi
rahul tiwari 110rahul tiwari 110
public class accConwrapper {
    @Auraenabled
    public static List<account> accountList{get; set;} 
    @Auraenabled
    public static List<contact> contactList{get; set;}
    @Auraenabled
    public static WrapperAccount wrapperInstance{get; set;}
    
    
    @Auraenabled
    public static WrapperAccount fetchAccount(){
        wrapperInstance = new WrapperAccount();
        accountList = new List<account>();
       
        try{
            
            for(Account accountInstance: [Select Id,Name,Phone from Account WITH SECURITY_ENFORCED]){
                accountList.add(accountInstance);
                system.debug('accountList@@@'+accountList);
            }
            wrapperInstance.accList = accountList;
            system.debug('accListtry=='+wrapperInstance.accList);
            wrapperInstance.message = 'No Error';
            wrapperInstance.isSuccess = true;
            
            
        }
        catch(exception e){
            System.debug('error--> '+e.getMessage()+' at ling no--> '+e.getLineNumber());
            wrapperInstance.accList = accountList;
            system.debug('accListcatch=='+wrapperInstance.accList);
            wrapperInstance.message = e.getMessage();
            wrapperInstance.isSuccess = false;
        }
        return wrapperInstance;
    }
    
    @Auraenabled
    public static WrapperAccount getContact(id accid){
        wrapperInstance = new WrapperAccount();
        contactList = new List<contact>();
        try{
            
            for(Contact accountInstance: [Select Id,Name,Phone from contact where accountid =:accid]){
                contactList.add(accountInstance);
                system.debug('contactList=='+contactList);
            }
            wrapperInstance.conList = contactList;
            system.debug('conListtry='+wrapperInstance.conList);
            wrapperInstance.message = 'No Error';
            wrapperInstance.isSuccess = true;
            
            
        }
        catch(exception e){
            System.debug('error--- '+e.getMessage()+' at line no=== '+e.getLineNumber());
            wrapperInstance.conList = contactList;
            system.debug('conListcatch=='+wrapperInstance.conList);
            wrapperInstance.message = e.getMessage();
            wrapperInstance.isSuccess = false;
        }
        return wrapperInstance;
    }
    
    
    public class WrapperAccount{
        @Auraenabled
        public List<Account> accList{get; set;}
        
        @Auraenabled
        public List<contact> conList{get; set;}
        
        @Auraenabled
        public Boolean isSuccess{get; set;}
        @Auraenabled
        public String message{get; set;}
        
    }
}
rahul tiwari 110rahul tiwari 110
User-added image

User-added image

I've check edall debugs,accounts debug are not showing in debug logs but contact's debug are coming
ContactList and conList of wrapper are getting all related contacts of it's account but on page no records are shown
Suraj Tripathi 47Suraj Tripathi 47
Hi,

I have solved the issue and it is working fine.

Declare this attribute on your component:-
 <aura:attribute name="conWrapperList" type="object"/> 

Now, on helperGetDetail method set :-    component.set('v.conWrapperList',response.getReturnValue());

Now on iteration of contacts change with this code :-  
 <lightning:select label="contact list" >

  <aura:iteration items="{!v.conWrapperList.conList}" var="con"> 
        <option label="{!con.Name}" value="{!con.Id}"/>  
    </aura:iteration> 
   </lightning:select>​​​​​​​


Please mark it as Best Answer if it helps you.

Thanks & Regards
Suraj Tripathi


 
This was selected as the best answer