Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
pp11222pp11222 

Expanding a Hierarchical Data Structure using apex and visualforce

I have a requirement to create a visuaforce page which shows data with is parent-child (one-to-many) relationships.

This scenario gets a little more complex if any of the child records contain children of their own (i.e.,  grandkids).  

 

For example, a bicycle is a top-level assembly that contains parts such as posts, wheels brakes and more.  Each of these parts can also contain multiple parts.   A wheel is a sub-assembly of the bicycle which  is composed of a rim, tire, spokes etcetera.  These sub-assemblies can further contain component parts and sub-assemblies of their own (e.g.,  hubs, chain rings and bearings).    

A Parts List table is used to store child records for the parts, relating them to parent records with a key field such as Parent Assembly ID.  

 

this is more like a bill of material.  For example (Indenture Level in parentheses):

                    -Bicycle (0)
                          - Wheel assembly (1)
                                - Rims (2)
                                - Tires (2)
                                - Hub assembly (2)
                                      - Sprockets (3)
                                      - Derailier (3)
                                      - Etc. (3)
                          - Brake assembly (1)
                                - Pads (2)
                                - Cables (2)
                                - Etc. (2)
                         - Etc (1)

 

 

 

I will really appreciate if some one can post an example of VF page and Apex controller to achive this.

 

Thanks

 

 

 

sfdcfoxsfdcfox

You'll need a recursive data structure, and an Apex Component.

 

The recursive class would appear as follows:

 

 

public class Node {
  public List<Node> subNodes { get; set; }
  public String Title { get; set; }
  public Node() {
    subNodes = new List<Node>();
  }
}

You'll also need a component that can display this recursive data:

 

 

 

<apex:component>
    <apex:attribute type="Node" name="node" required="true" />
    <apex:outputText>{!node.title}</apex:outputText>
    <apex:repeat value="{!node.subnodes}" var="subnode">
        <c:node node="{!subnode}"/>
    </apex:repeat>
</apex:component>

 

From this point, it's simply a matter of querying the data, populating the recursive structure, and then handing it to an apex:repeat component on the page. Of course, you'll need a little more complexity for handling indentation, collapsible nodes, and so on, to suit your requirements, but this is the basic structure that would be used to create this type of tree-view.

 
meerameera

Hi sfdcfox,

 

I have tried out the solution that you mentioned below for getting the recursive data:

But when I am using the component I am getting an error"Error: Cyclic page or component references '/apexcomponent/c__testcomp1' are not allowed.

 

For the code:

apex:component> <apex:attribute type="Node" name="node" required="true" /> <apex:outputText>{!node.title}</apex:outputText> <apex:repeat value="{!node.subnodes}" var="subnode"> <c:node node="{!subnode}"/> </apex:repeat> </apex:component>

 

instead of <c:node node="{!subnode}"/> I have used <c:testcomp1 node="{!subnode}"/> which is the name of my component.

 

Kindly let me know whether there exists any solution for this.

Ken KoellnerKen Koellner

I ran into the same problem.  I wanted to use a recursive list of options and it wouldn't let me nest the same component.

 

I'm currently trying to figure out a solution.  I haven't investigated dynamic VF at all yet.

 

One thing I was thinking of is coding several copies of my compenent, node0.component, node1.component, node2.component, node3.componet, etc. to my max depth.  Then put a getter in the node that indicates depth.  Then conditional render the appropriate component.  That's freaking ugly as I have to repeat identify code in multiple modules but since my depth will only be two or three levels, it's not prohibitive.

 
Ken KoellnerKen Koellner

Actually I thought of a simpler solution, no depth indicator is needed.  You would have to code several almost identical components --

 

node0.component would have

 

  <c:node1..>

  <c:node...>

 

node1.compoenent would have

 

  <c.node2...>

  <c.node2...>

 

etc.

 

All the nodeX.component modules would be identical except for which component they bring in. 

 

 

 
MagulanDuraipandianMagulanDuraipandian
Check this

http://www.infallibletechie.com/2014/02/cyclic-page-or-component-references.html

If this solves your problem, kindly mark it as the best answer.

Regards,
Magulan
http://www.infallibletechie.com