[SOLVED] Tree structure using WebFOCUS

July 07, 2005, 05:26 PM

Francis Mariani

An example. (You will need the
two images that show + and -).

-* File buildtree.fex
DEFINE FILE CAR TCNT/I9 WITH 
CAR=TCNT + 1;END
>TABLE FILE CAR PRINT
COMPUTE ACNT/A1=IF COUNTRY EQ 
LAST COUNTRY THEN 'N' ELSE 'Y'; 
NOPRINT
  COMPUTE TNODEH/A200=IF TCNT EQ 1 
THEN '<TABLE BORDER=0><TR><TD><A onClick="Toggle(this)">' ||
'[IMG]/approot/test/images/plus.gif[/IMG]' 
|| COUNTRY ||
</A><DIV style="display:none">' 
ELSE
  IF ACNT EQ 'Y' THEN '</DIV>
</TD></TR></TABLE>' 
<TABLE BORDER=0><TR>
<TD><A onClick="Toggle(this)">' ||
'[IMG]/approot/test/images/plus.gif[/IMG]' 
|| COUNTRY ||
'</A><DIV style="display:none">' 
ELSE ''; AS ''
 COMPUTE LEAF/A512='
<TABLE BORDER=0><TR><TD WIDTH=10>
</TD><TD>' [IMG]/approot/test/images/leaf.gif[/IMG]' 
|| CAR ||'<DIV style="display:none">
</DIV>
</TD></TR></TABLE>'; AS ''
BY COUNTRY NOPRINT
ON TABLE SET PAGE-NUM OFF
ON TABLE SET HOLDLIST PRINTONLY
ON TABLE SET BYDISPLAY OFF
 ON TABLE HOLD AS FILEA FORMAT ALPHA
ND<br />-RUN
-HTMLFORM BEGIN<br /><HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
---------------------------------------------
Name:    
Easy DHTML Treeview           
Author:  D.D. de Kerf                  
>// --- Version: 0.2          
Date: 13-6-2001  ---------------------------------------------
function Toggle(node)
// Unfold the branch if it isn't 
visible if 
(node.nextSibling.style.
display == 'none')
Change the image 
(if there is an image)
if (node.childNodes.length > 0) 
if (node.childNodes.item(0).
nodeName == "IMG")   
node.childNodes.item(0).src = /approot/test/images/minus.gif";
node.nextSibling.style.
display = 'block';  Collapse the branch 
if it is visible
 else Change the image 
(if there is an image)   
if (node.childNodes.length > 0)    
if (node.childNodes.item(0)
.nodeName == 
"IMG")node.childNodes.item(0).src = "/approot/test/
images/plus.gif"; node.nextSibling.
style.display = 
'none'
</SCRIPT>
</HEAD>
<BODY><br />!IBI.FIL.FILEA;
</BODY>
</HTML>
HTMLFORM END

This message has been edited. Last edited by: <Mabel>,

July 11, 2005, 12:56 PM

Cyril Joy

Thanks Francis for you help.i have to try out this and will let you know.

sugarbunnies, I just want a tree like structure as in the windows explorer for my report.

July 11, 2005, 01:57 PM

Cyril Joy

Excellent code,Francis.
Let me see how i can implement this in my report.

November 10, 2009, 01:21 PM

getit

Francis,
I was trying to use your code..but getting errors which I cannot fix....
could you paste a cleaner code which if I copy runs without errors.I do have the images.

November 10, 2009, 01:35 PM

Darin Lee

If you're on 7.6.5, just use the "Accordion Report" functionality using the EXPANDABLE keyword. No need to code all of this that was necessary in older versions to accomplish the same thing.

On a side note, due to difference in environments, software versions, etc., it's not likely that someone else can simply put up code that you can copy and paste without having errors in your environment. If you can't clean up the code and modify what you need to make it work in your environment, I would suggest a little training so you understand what it is that the code you wnat to use is trying to do.

November 10, 2009, 02:22 PM

Francis Mariani

As mentioned, you're probably better off using the new features of WebFOCUS. I posted that code in 2005 - it looks mangled - here's clean, working code:

-* File buildtree.fex

SET HOLDLIST   = PRINTONLY
SET HOLDFORMAT = ALPHA
-RUN

DEFINE FILE CAR
TCNT/I9 WITH CAR = TCNT + 1;
END
-RUN

TABLE FILE CAR
PRINT
COMPUTE ACNT/A1 = IF COUNTRY EQ LAST COUNTRY THEN 'N' ELSE 'Y'; NOPRINT
COMPUTE TNODEH/A200 = IF TCNT EQ 1 THEN
  '<table border=0><tr><td><a onclick="Toggle(this)">' ||
  '<img src="/approot/test/images/plus.gif" style="margin-right: 6px;">' || COUNTRY ||
  '</a><div style="display:none">'
ELSE IF ACNT EQ 'Y' THEN '</div></td></tr></table>' ||
  '<table border=0><tr><td><a onclick="Toggle(this)">' ||
  '<img src="/approot/test/images/plus.gif" style="margin-right: 6px;">' || COUNTRY ||
  '</a><div style="display:none">'
ELSE ''; AS ''
COMPUTE LEAF/A200 =
  '<table border=0><tr><td width=10></td><td>' ||
  '<img src="/approot/test/images/leaf.gif" style="margin-right: 6px;">' || CAR ||
  '<div style="display:none"></div></td></tr></table>'; AS ''

BY COUNTRY NOPRINT

ON TABLE HOLD AS FILEA
END
-RUN

-HTMLFORM BEGIN
<html>
<head>
<script type="text/javascript">

// ---------------------------------------------
// --- Name:    Easy DHTML Treeview           --
// --- Author:  D.D. de Kerf                  --
// --- Version: 0.2          Date: 13-6-2001  --
// ---------------------------------------------
function Toggle(node)
{
// Unfold the branch if it isn't visible
if (node.nextSibling.style.display == 'none')
  {
  // Change the image (if there is an image)
  if (node.childNodes.length > 0)
    {
    if (node.childNodes.item(0).nodeName == "IMG")
      {
      node.childNodes.item(0).src = "/approot/test/images/minus.gif";
      }
    }

  node.nextSibling.style.display = 'block';
  }
// Collapse the branch if it is visible
else
  {
  // Change the image (if there is an image)
  if (node.childNodes.length > 0)
    {
    if (node.childNodes.item(0).nodeName == "IMG")
      {
      node.childNodes.item(0).src = "/approot/test/images/plus.gif";
      }
    }

  node.nextSibling.style.display = 'none';
  }
}
</script>

<style type="text/css">
body
{
font-family: "Trebuchet MS", sans-serif;
font-weight: normal;
}
td
{
font-size: .8em;

}
</style>
</head>

<body>
!IBI.FIL.FILEA;
</body>
</html>
-HTMLFORM END

I should specify that the DHTML/JS code came from The Code Project > Easy DHTML treeview By D.D. de Kerf

November 10, 2009, 03:18 PM

Francis Mariani

A demo I created in 2004, using my own focus, html and js code:

November 10, 2009, 04:41 PM

getit

Thanks a lot Francis, this is exactly what I am trying to do...
Its really great that you have this code available after so many years.

The hierarchy that you displayed in the screen shot and the measures summed up is exactly what I need. Was this achieved using the same technique mentioned above by you or is there anything else that I need to incorporate.??

November 10, 2009, 05:06 PM

getit

Francis,
If you have the source code for the above demo ,
please mail it to me at sowmyapindi@yahoo.com...It saves a lot of time.
Thanks again for all your help.

November 10, 2009, 05:16 PM

Francis Mariani

Unfortunately, this is a screenshot of code I no longer have. But the mechanics of the "tree" is probably very similar to the code I posted. The rest of it uses WebFOCUS to retrieve the values for the filter list boxes. Whenever something changes, the fex is rerun with the new filter.

Of course, all this is probably doable with the new features of WebFOCUS. "Accordian Reports" is not and extra licence, and could most probably be used, while "Active Reports" is an extra licence.

November 11, 2009, 01:17 PM

getit

What does the
TCNT/I9 WITH CAR = TCNT + 1;

do.?

I tried looking for help and in forums but couldn't find it.

November 11, 2009, 05:31 PM

GinnyJakes

Without the WITH, the defined field will be associated with the top segment. The WITH allows you to associate the defined field with a different segment.

Here is a little bit of doc:

quote:
WITH can be used to move the logical home for the virtual field to a segment lower than that to which it would otherwise be assigned (for example, to count instances in a lower segment).

November 12, 2009, 10:35 AM

Francis Mariani

And TCNT increments a counter when the CAR column changes:

DEFINE FILE CAR
TCNT/I9 WITH CAR = TCNT + 1;
END
-RUN

TABLE FILE CAR
PRINT TCNT
*
END

December 10, 2009, 06:10 AM

It's Alive!

hi francis.. is it possible to link the output of the tree structure (as hyperlinks) to other reports.. so that on clinking a country or car name, another report opens up which uses these values as input.. i tried with the focexec but it isn't working or i am doing it wrong... basically what i want is a tree structure on the left of the screen, on clickin which diffrenet reports can be populated on the right of the screen... i'm up against a wall with this !