Monday, October 30, 2017

Lightning Tree : Generic Lightning Component to Display Hierarchy for any sObject

In API version 41.0, Salesforce has introduce new component called lightning:tree. This can be used to display hierarchy in tree structure. Before this, we have to used jquery or other javascript libraries to implement this.

After introduction of lightning:tree, it is very easy to use this and implement this in short time.

I have created a generic lightning component to display records hierarchy in tree structure. You just have specify below attributes to component to display tree structure:

  • ltngcurrentRecId : Salesforce 15 or 18 digit Id of any record for which you want to see hierarchy.
  • ltngSobjectname : sObject API name (like Account, Case, Position__c etc.)
  • ltngParentFieldAPIName : Field API name which creates self relationship between records.
  • ltngLabelFieldAPIName : Field API name which will be used to display records in tree structure(like Name, CaseNumber, Title__c etc.).
  • ltngHierarchyHeader : Header label which will be displayed above tree structure.


Below is complete complete code for your reference:


You can use this code as reference and can implement different logic.

Hope this will help!!!

Looking forward for everyone's comments and suggestions.

3 comments:

  1. Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a Front end developer learn from Javascript Training in Chennai . or learn thru Javascript Training in Chennai. Nowadays JavaScript has tons of job opportunities on various vertical industry. JavaScript Training in Chennai

    ReplyDelete
  2. Is there any way to return additional fields for the tree as well? Perhaps even just a name + text field?

    ReplyDelete
  3. Hi,

    Create formula field and concatenate all the fields values as per required format and then refer that formula field in "ltngLabelFieldAPIName" attribute.
    ltngLabelFieldAPIName="UniqueValue__c"


    Hope this helps!!

    Thanks

    ReplyDelete