Created
February 26, 2018 13:22
-
-
Save amitastreait/42e2f6b27c270e0ccd65d3f653f45683 to your computer and use it in GitHub Desktop.
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
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction,force:hasSObjectName" | |
controller='DynamicBindingDemoController' | |
access="global" > | |
<!-- call the doInit method to load the list of All the Available Objects into the Org --> | |
<aura:handler name='init' value='{!this}' action='{!c.doInit}' /> | |
<aura:attribute name='objectList' type='List' /> | |
<aura:attribute name="isSending" type="boolean" /> | |
<c:Spinner /> | |
<div class="slds-m-around_small"> | |
<div class="slds-page-header"> | |
<div class="slds-media"> | |
<div class="slds-media__body"> | |
<h1 class="slds-page-header__title slds-truncate slds-align-middle" title="Dynamic Binding in Ligtning Component"> | |
Dynamic Field Binding in Ligtning Component</h1> | |
<p class="slds-text-body_small slds-line-height_reset"> | |
By SFDC Panther • 24/02/2018</p> | |
</div> | |
</div><br/> | |
</div><br/> | |
<div class="slds-grid slds-wrap"> | |
<div class="slds-size_1-of-2"> | |
<div class="slds-box_x-small"> | |
<!-- show the list of All the Object --> | |
<lightning:select name="selectObject" label="Select an Object" | |
onchange="{!c.doHandleChange}" aura:id='selectObject'> | |
<option value="" text="- None -" /> | |
<aura:iteration items='{!v.objectList}' var='obj'> | |
<option value="{!obj.key}" text="{!obj.value}" /> | |
</aura:iteration> | |
</lightning:select> | |
</div> | |
</div> | |
<br/> | |
<ui:scrollerWrapper class="scrollerSize"> | |
<div class="slds-size_2-of-2"> | |
<div id='sfdctable' aura:id='sfdcDiv'> | |
<!-- devision that will show the dynamic content --> | |
</div> | |
</div> | |
</ui:scrollerWrapper> | |
</div> | |
</div> | |
</aura:component> |
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
({ | |
doInit : function(component, event, helper) { | |
helper.onInit(component, event, helper); | |
}, | |
doHandleChange : function(component, event, helper) { | |
helper.onHandleChange(component, event, helper); | |
}, | |
}) |
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
({ | |
onInit : function(component, event, helper) { | |
/* Call the Apex class method to fetch the List of all object */ | |
var action = component.get('c.listAllObject'); | |
action.setCallback(this, function(response){ | |
var state = response.getState(); | |
if(state === 'SUCCESS' && component.isValid()){ | |
/* set the value to the attribute of the component */ | |
var responseValue = response.getReturnValue(); | |
var lstOptions = []; | |
for(var i=0; i < responseValue.length; i++){ | |
lstOptions.push({ | |
value : responseValue[i].split('####')[1], | |
key : responseValue[i].split('####')[0] | |
}); | |
} | |
lstOptions.sort(); | |
component.set('v.objectList', lstOptions); | |
}else{ | |
var errors = response.getError(); | |
$A.log(errors); | |
if(errors || errors[0].message){ | |
console(errors[0].message); | |
} | |
} | |
}); | |
$A.enqueueAction(action); | |
}, | |
onHandleChange : function(component, event, helper){ | |
/* Call this method whenever user will select the Obejct | |
* and show the Dynamic Content */ | |
var selObject = component.find('selectObject').get('v.value'); | |
var action = component.get('c.listAllFields'); | |
if(selObject!=null && selObject!='' && selObject!=undefined){ | |
action.setParams({ | |
"objectName" : selObject | |
}); | |
action.setCallback(this, function(response){ | |
var state = response.getState(); | |
if( state === 'SUCCESS' && component.isValid()){ | |
//component.find("dynamicBody").set("v.body",[]); | |
component.find('sfdcDiv').set("v.body",[]); | |
var responseValue = response.getReturnValue(); | |
var objectValue = responseValue.sObjectData; | |
var fieldList = responseValue.fieldList; | |
/* Create Dynamic Table */ | |
var sObjectDataTableHeader = []; | |
// Create table Header | |
for (var i=0; i < fieldList.length; i++) { | |
sObjectDataTableHeader.push(fieldList[i].label); | |
} | |
console.log(sObjectDataTableHeader); | |
//Get the count of columns. | |
var columnCount = sObjectDataTableHeader.length; | |
//Create a HTML Table element. | |
var table = document.createElement("TABLE"); | |
//table.border = "1"; | |
//Add the header row. | |
var row = table.insertRow(-1); | |
for (var i = 0; i < columnCount; i++) { | |
var headerCell = document.createElement("TH"); | |
headerCell.innerHTML = sObjectDataTableHeader[i]; | |
headerCell.className='hearderClass'; | |
row.appendChild(headerCell); | |
} | |
var dvTable = document.getElementById("sfdctable"); | |
dvTable.innerHTML = ""; | |
dvTable.appendChild(table); | |
/* Create Dynamic Table End */ | |
if(objectValue.length){ | |
for(var j=0; j < objectValue.length; j++){ | |
// Dynamic table Row | |
row = table.insertRow(-1); | |
// Dynamic Table Row End | |
for (var i=0; i < fieldList.length; i++) { | |
// Dynamic table Row | |
var cell = row.insertCell(-1); | |
cell.innerHTML = objectValue[j][fieldList[i].apiName]; | |
component.set('v.isSending' , false); | |
} | |
} | |
}else{ | |
} | |
}else{ | |
var errors = response.getError(); | |
$A.log('Error Details '+errors); | |
if( errors || errors[0].message){ | |
console.log('Error Details '+errors[0].message); | |
} | |
} | |
}); | |
$A.enqueueAction(action); | |
}else{ | |
component.set('v.isSending' , false); | |
} | |
}, | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment