Solved

Using CFTREE to show recursive relationships

Posted on 2012-04-13
6
1,112 Views
Last Modified: 2012-04-14
I'm struggling to expose a hierarchical query as a tree view in ColdFusion.  I just can't figure out the mechanics.  
Initially I want to expose it without a bind to a cfc.  Then I want to expose it with a bind to a cfc so I can take advantage of the complete tree not loading until it is clicked.

Here is what the first level needs to be exposed as:
First Level ExposedWhen you open all the levels:
Expanded
Here a sample table which ties the parent and children together.
CREATE TABLE mycurric
    (parent_cd_crs                  VARCHAR2(30 BYTE),
    child_cd_crs                   VARCHAR2(30 BYTE))
/
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('MASTERCU','CRSA');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('MASTERCU','LEVEL1ACU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('MASTERCU','LEVEL1BCU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('MASTERCU','LEVEL1CCU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1ACU','CRSB');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1ACU','CRSC');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1ACU','CRSD');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1ACU','CRSE');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1BCU','LEVEL2ACU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1BCU','LEVEL2BCU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1BCU','LEVEL2CCU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1CCU','CRSC');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL1CCU','CRSG');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL2ACU','CRSA');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL2ACU','CRSF');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL2BCU','CRSG');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL2CCU','LEVEL3ACU');
INSERT INTO mycurric (CURRIC_CD_CRS,CHILD_CD_CRS) 
VALUES('LEVEL3ACU','CRSD');

Open in new window


My attempt which didn't yield what I expected
<html>
<title> my curric TreeExample</Title>

<body>
    <cfform name="myform">
	
	<cfquery name="GetList" datasource="myConn" username="myuser" password="mypad">
            SELECT parent_cd_crs, child_cd_crs from mycurric</cfquery> 
	
	
        <cftree name="treeTest" height="400" width="200" format="html">
        <cftreeitem 
            query="GetList" 
            value="parent_cd_crs,child_cd_crs" 
			parent="parent_cd_crs"
            display="parent_cd_crs, child_cd_crs" 
			queryasroot="NO" expand="no">
        </cftree>
    <hr>
	
	
</cfform>
</body>
</html>

Open in new window


My output looks like this as it doesn't walk up tree
Bad Tree
0
Comment
Question by:E43509
  • 3
  • 2
6 Comments
 
LVL 28

Accepted Solution

by:
Pravin Asar earned 500 total points
ID: 37845153
Looks like this a CF Bug .


Here is my test code.

<cfset qry=QueryNew("id,parentid,title","Integer,Integer,VarChar")>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",1)>
<cfset tt=QuerySetCell(qry,"title","Node 1")>
<cfset tt=QuerySetCell(qry,"parentid",0)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",11)>
<cfset tt=QuerySetCell(qry,"title","Node 1.1")>
<cfset tt=QuerySetCell(qry,"parentid",1)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",111)>
<cfset tt=QuerySetCell(qry,"title","Node 1.1.1")>
<cfset tt=QuerySetCell(qry,"parentid",11)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",12)>
<cfset tt=QuerySetCell(qry,"title","Node 1.2")>
<cfset tt=QuerySetCell(qry,"parentid",1)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",2)>
<cfset tt=QuerySetCell(qry,"title","Node 2")>
<cfset tt=QuerySetCell(qry,"parentid",0)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",21)>
<cfset tt=QuerySetCell(qry,"title","Node 2.1")>
<cfset tt=QuerySetCell(qry,"parentid",2)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",211)>
<cfset tt=QuerySetCell(qry,"title","Node 2.1.1")>
<cfset tt=QuerySetCell(qry,"parentid",21)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",22)>
<cfset tt=QuerySetCell(qry,"title","Node 2.2")>
<cfset tt=QuerySetCell(qry,"parentid",2)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",3)>
<cfset tt=QuerySetCell(qry,"title","Node 3")>
<cfset tt=QuerySetCell(qry,"parentid",0)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",31)>
<cfset tt=QuerySetCell(qry,"title","Node 3.1")>
<cfset tt=QuerySetCell(qry,"parentid",3)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",311)>
<cfset tt=QuerySetCell(qry,"title","Node 3.1.1")>
<cfset tt=QuerySetCell(qry,"parentid",31)>

<cfset tt=QueryAddRow(qry)>
<cfset tt=QuerySetCell(qry,"id",32)>
<cfset tt=QuerySetCell(qry,"title","Node 3.2")>
<cfset tt=QuerySetCell(qry,"parentid",3)>

<cfform name="f1" format="html">
      <table>
            <tr>
                  <td>TREE (QUERY)
                  </td>
                  <td>TREE (LOOP)
                  </td>
            </tr>
            <tr>
                  <td>
      <cftree format="html" name="Testtree1" label="TREE1 (BUG ???)"  >
                  <cftreeitem query="qry"   value="id" display="title" parent="parentid"/>
      </cftree>
                        
                  </td>
                  <td>
      <cftree format="html" name="Testtree2"  label="TREE2 (WORKS)" >
            <cfloop query="qry"  >
                  <cftreeitem  value="#id#" display="#title#" parent="#parentid#"/>
            </cfloop>
      </cftree>
                        
                  </td>
            </tr>
      </table>
            
</cfform>
0
 

Author Comment

by:E43509
ID: 37845225
Thank you.
I've been beating myself up trying to noodle out how this tag worked and not getting anything good out of it.
Appreciate your timely response.
I was wondering if I should stay away from the cftree tag and devote my efforts toward a javascript/css solution instead?  I could not find a lot of info when I google'd CFTREE.  
Which way would you lean?
Thanks again.
0
 
LVL 15

Expert Comment

by:myselfrandhawa
ID: 37846064
yes, certainly a CSS?javascript/Jquery Solution would be much better, if you still wanna use cftree, i suggest you to look into the custom tag cfx_tree which is free and quite advantageous ranther than cftree.

or you can create a custom tag to make recursive calls. but that may slow down the things
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

Author Comment

by:E43509
ID: 37846167
Thanks.
I could not find cfx_tree in my searches ... do you have a url?
I found a cf_dbtree ($)
0
 

Author Closing Comment

by:E43509
ID: 37846168
Excellent and robust response.
0
 
LVL 15

Expert Comment

by:myselfrandhawa
ID: 37846228
i checked this too

http://www.cftagstore.com/tags/cftreecontrol.cfm

a customtag but worth its usage
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

This is an updated version of a post made on my blog over 3 years ago. It is unfortunately, still very relevant as we continue to see both SQLi (SQL injection) and XSS (cross site scripting) attacks hitting some of the most recognizable website and …
If you have heard of RFC822 date formats, they can be quite a challenge in SQL Server. RFC822 is an Internet standard format for email message headers, including all dates within those headers. The RFC822 protocols are available in detail at:   ht…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now