Hey guys, In this post we are going to learn about that how to Wrapper class Retrieve all the Values in Salesforce lightning component.
In this example we will fetch all the values from Custom sObject by help of wrapper apex class in lightning component.
Files we used in this post example:-
| File Name | File Type | Description |
|---|---|---|
| wrapperClassCustomObjApp.app | Lightning Component Application | It is used for Call the component to preview the output on browser. |
| wrapperClassCustomObjCmp.cmp | Lightning Component Application | It is used to user interface display on the client side. |
| wrapperClassCustomObjCmpConroller.js | JavaScript Controller File | It is used for client side javascript function. |
| wrapperClassCustomObjCmpConrollerHelper.js | JavaScript Helper File | Helper called in the Javascript controller Init function. |
| wrapperCustomObjCtrCmp.apxc | Apex Class Controller | For retrieve all the record from database server |
|
Custom Object:- NewStudent__c Custom Object Fields:- Id, Name, Email__c, Address__c
|
Custom Object and their fields | Custom object like database and custom fields are column of data table. |
Other post that would you like to learn…
Step 1:- Create Lightning Application : wrapperClassCustomObjApp.app
From Developer Console >> File >> New >> Lightning Application
wrapperClassCustomObjApp.app [Component Application File]
|
1 2 3 |
<aura:application extends="force:slds"> <c:wrapperClassCustomObjCmp/> </aura:application> |
Step 2:- Create Lightning Component : wrapperClassCustomObjCmp.cmp
From Developer Console >> File >> New >> Lightning Component
wrapperClassCustomObjCmp.cmp [Lightning Component File]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<aura:component controller="wrapperCustomObjCtrCmp" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction,lightning:isUrlAddressable" access="global" > <aura:attribute name="wrapListItems" type="NewStudent__c[]"/> <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> <aura:attribute name="recSelectId" type="String" default=""/> <div class="slds slds-p-horizontal--medium"> <table class="slds-table slds-table--bordered slds-table--col-bordered" style="border-collapse:collapse;"> <thead> <tr> <th>Student Name</th> <th>Email</th> <th>Address</th> </tr> </thead> <tbody> <aura:iteration items="{!v.wrapListItems}" var="wrapVar" indexVar="index"> <tr id="{!wrapVar.recStudentId}"> <td>{!wrapVar.studentName}</td> <td>{!wrapVar.studentEmail}</td> <td>{!wrapVar.studentAddress}</td> </tr> </aura:iteration> </tbody> </table> </div> </aura:component> |
Step 3:- Create Lightning Component : wrapperClassCustomObjCmpConroller.js
From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller
wrapperClassCustomObjCmpConroller.js [JavaScript Controller]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
({ doInit : function(component, event, helper) { var action = component.get("c.appCustomWrapListMthd"); action.setCallback(this, function(response){ var state = response.getState(); if(state=='SUCCESS'){ var result = response.getReturnValue(); component.set('v.wrapListItems',result); } }); $A.enqueueAction(action); }, }) |
Step 4:- Create Lightning Component : wrapperClassCustomObjCmpConrollerHelper.js
From Developer Console >> File >> New >> Lightning Component >> JavaScript Helper
wrapperClassCustomObjCmpConrollerHelper.js [JavaScript Helper File]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
({ refreshView : function(component, event, helper) { var action = component.get("c.appCustomWrapListMthd"); action.setCallback(this, function(response){ var state = response.getState(); if(state=='SUCCESS'){ var result = response.getReturnValue(); component.set('v.wrapListItems',result); } }); $A.enqueueAction(action); } }) |
Step 5:- Create Lightning Application : wrapperCustomObjCtrCmp.apxc
From Developer Console >> File >> New >> Apex Class
wrapperCustomObjCtrCmp.apxc [Apex Class Controller]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
public class wrapperCustomObjCtrCmp { public class wrapperCustomClass{ @AuraEnabled public string studentName; @AuraEnabled public string studentEmail; @AuraEnabled public string studentAddress; @AuraEnabled public Id recStudentId; public wrapperCustomClass(string studentName, string studentEmail, string studentAddress, Id recStudentId){ this.studentName = studentName; this.studentEmail = studentEmail; this.studentAddress = studentAddress; this.recStudentId = recStudentId; } } @AuraEnabled public static List<wrapperCustomClass> appCustomWrapListMthd(){ List<NewStudent__c> newStudent = new List<NewStudent__c>(); List<wrapperCustomClass> custWrapObj = new List<wrapperCustomClass>(); List<NewStudent__c> newStudentView =[Select Id, Name, Email__c, Address__c From NewStudent__c]; Set<Id> projChecklistIdSet= new Set<Id> (); for(NewStudent__c de: newStudentView) { projChecklistIdSet.add(de.Id); } for(NewStudent__c studentObj:newStudentView){ custWrapObj.add(new wrapperCustomClass(studentObj.Name,studentObj.Email__c, studentObj.Address__c,studentObj.Id)); } return custWrapObj; } } |
Further post that would you like to learn…
Related Topics
How to return data from multiple objects using wrapper class in lightning component
How to fetch picklist values from apex controller in lightning component
How to display upload Image if a record existing an attachment in lightning component?
Custom record search and delete functionality in lightning component
You Can Join Stock Market Classes In IndoreBest NISM & Trading Share Market Technical Analysis
I am also proggrammer easy to understandalbe