Salesforce has introduced new tag called lightning:treegrid which can be used to display tree structure in tabular form. Lightning:tree can be used to display the hierarchy but if you want to display additional information then lightning:treegrid becomes useful.
If you want to lean how to use lightning:tree tag to display hierarchy for any record then refer below URL:
Lightning Tree : Generic Lightning Component to Display Hierarchy for any sObject
If you have to display account hierarchy along with another fields information as displayed in below image, then use treegrid.
Below is complete code to display account hierarchy. Just pass account record Id and lightning component will display complete hierarchy.
Hope this help!!!
If you want to lean how to use lightning:tree tag to display hierarchy for any record then refer below URL:
Lightning Tree : Generic Lightning Component to Display Hierarchy for any sObject
If you have to display account hierarchy along with another fields information as displayed in below image, then use treegrid.
Below is complete code to display account hierarchy. Just pass account record Id and lightning component will display complete hierarchy.
Hope this help!!!
useful post.
ReplyDeleteyou people are really great ,i am getting the ERROR in the following lines.please help.
ReplyDeletecomponent.set("v.gridData", roles[undefined]._children);
console.log('*******treegrid data:'+JSON.stringify(roles[undefined]._children));
you people are really great ,i am getting the ERROR in the following lines.please help.
ReplyDeletecomponent.set("v.gridData", roles[undefined]._children);
console.log('*******treegrid data:'+JSON.stringify(roles[undefined]._children));
This page has an error. You might just need to refresh it.
ReplyDeleteError in $A.getCallback() [Cannot read property 'config' of undefined]
Callback failed: apex://SK_AccountTreeGridCmpController/ACTION$findHierarchyData
Failing descriptor: {c:SK_AccountTreeGridCmp}
Hi,
DeleteCan you please code to call this component. I just wanted to know what all parameters you are passing to this component.
Thanks
I call the component by below code:
DeleteThank you so much !!!
ReplyDeleteCan you please help load asynchronous on tree grid.
ReplyDeleteThis works as a pro Awesome Site.
ReplyDeleteCant see the code any longer?!
ReplyDeletei am not able to see the code , please review the page ?
ReplyDeleteHi, Is there a way to retain the checkbox of child rows when the parent row is expanded and collapsed? Sample code should be really helpful. I am facing one issue with the tree grid when i expand the parent row and then i checked few child rows and then collapsed and re expanded the parent row. The check boxes on child rows are no longer checked.
ReplyDeleteCan we add icons infront of Account Name to define what type of Account this is?
ReplyDeleteI am not able to view code, please recheck...
ReplyDeleteHello , thank you for the code sample, I need a modification in this but not able to do that, plz help in this if possible, I want to remove the arrow mark before the code if there is no child for that record. How to do that
DeleteWow. There's some magic in there I do not understand!
ReplyDeleteSo you return a list of accounts then, somehow, created the tree structure.
How does this section of code work?
----------------------
var roles = {};
console.log('*******apexResponse:'+JSON.stringify(apexResponse));
var results = apexResponse;
roles[undefined] = { Name: "Root", _children: [] };
apexResponse.forEach(function(v) {
expandedRows.push(v.Id);
roles[v.Id] = {
accountName: v.Name ,
name: v.Id,
Type:v.Type,
Industry:v.Industry,
AccountURL:'/'+v.Id,
_children: [] };
});
apexResponse.forEach(function(v) {
roles[v.ParentId]._children.push(roles[v.Id]);
});
component.set("v.gridData", roles[undefined]._children);
---------------------
what is the [undefined] syntax?
OK. I get it now. The accountID is usually the index but you create a special, easily identifiable, index using 'undefined' and this is the root node of everything else.
DeleteI love it. Thank you so much for the blog.
In fact, it does the whole accounts hierarchy with a simple apex method:
ReplyDelete@AuraEnabled
public static List fetchAllAccounts (){
List accList = new List();
accList = [SELECT Id, ParentID, Name FROM Account WHERE IsPersonAccount = false ORDER BY Name];
return accList;
}
Amazing.
Homeowners who try to tackle the chore of removing a tree by themselves often find that they are rapidly overwhelmed by the task. tree removal
ReplyDeleteWhether you are looking to have an entire tree removed or one or two stumps that need grounding down, you will certainly appreciate the quality services offered by the tree surgeon. tree surgeon worcester
ReplyDeleteYou can also search on the internet and find websites where you can avail surgeon of tree service. tree surgeon luton
ReplyDelete