Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only. Moving forward, myibi is our community platform to learn, share, and collaborate. We have the same Focal Point forum categories in myibi, so you can continue to have all new conversations there. If you need access to myibi, contact us at myibi@ibi.com and provide your corporate email address, company, and name.


Connect to myibi
Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     HTML Composer: How to make the Tree Control intelligent
Page 1 2 

Read-Only Read-Only Topic
Go
Search
Notify
Tools
HTML Composer: How to make the Tree Control intelligent
 Login/Join
 
Expert
posted
I've just started playing with the Tree Control. I don't know when this was introduced to HTML Composer, but it appears to lack some basic capabilities.

I would like to add a control to search for an item in the Tree Control.

I would like to add a button to expand or collapse the Tree Control.

I would like to add a button to select all or de-select all items in the Tree Control.

Has anyone been able to add these capabilities?

I haven't found anything in the documentation "Designing a User Interface for a Web Application With the HTML Composer" that discusses how you get a Tree Control with check boxes rather than radio buttons. It has to do with whether or not the control is set to multi-select, but I don't see that property anywhere.

Switching back and forth from Design, Parameters and HTML tabs seems to make the Tree Control external procedure run every time you return to the Design tab.

This message has been edited. Last edited by: Francis Mariani,


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Virtuoso
posted Hide Post
Finally found the way to choose between Radio and Checkboxes. I knew it had something to do with Single vs Multiple selection but could not find any property in Composer that would allow that to happen.

After going through some old code I had written I found it.

It all lies in the target .fex and how it handles the &parameter tied to the control.

For the tree control to use checkboxes, that is, to allow multiple selection, the .fex has to specify the &parameter as a multi-select OR:

WHERE NODE_NO EQ &P_NODE_NO.(OR(<1,1>,<1,2>)).P_NODE_NO.;


If you want radio buttons in the tree control, that is, a single select, then the underlying .fex has to use the parameter as this:

WHERE NODE_NO EQ &P_NODE_NO


This all assumes of course that the tree control created in HTML Composer is linked to the P_NODE_NO parameter in the example and then it will work.

Not very intuitive, I know ... I should say, not intuitive *at all* but that's how it is.



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
 
Posts: 1533 | Registered: August 12, 2005Report This Post
Guru
posted Hide Post
Welcome to my world.

1. In order to make it Mult-select > Go to paramaters tab and create a new paramter using the Multselect OR option. It's not clean as if you re-link your report, you will lose it if you have a -Default in there, so you need to drop and recreate it everytime you do that. -- We use a lot of SQL Pass-thru so we can't use njsden's suggestion

2. As far as deselcting all the selected, you can add a button and using a javascript function to unselect all.

3. This is my first attempt at using Tree Controls.

4. Saved Paramters do not work quite well with Tree Controls. It also saves above selected values which is supposed to be fixed in HF6, but I installed HF 6 and now my tree controls do not display at all.

5. I wish I could find a way to get the Displayed value of the tree control. I can get the name of the control and each level, as well as the value, but it would be nice to get the display.

I have spent the last few weeks working with Tree Controls, it's a slow process with them and this has been my worst nightmare at the moment.


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Expert
posted Hide Post
Neftali,

Thanks for sharing your discovery. I would have never figured it out as I cannot find this behaviour documented in "Designing a User Interface for a Web Application With the HTML Composer".

MattC,

Self imposed discipline will turn the nightmare into a bad dream and that prepares you for the next nightmare...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
I've been reading the posts about the tree control. Can anyone tell me an example of how you would use it? I've never tried using it, mostly because I haven't figured out what I would do with it. An example or 2 would be most appreciated. I guess my creativity is fading now that I'm getting more "seasoned" (OLD).

Mike in DeLand


Webfocus 8
Windows, Linux
 
Posts: 258 | Location: Palm Coast, FL | Registered: February 05, 2010Report This Post
Guru
posted Hide Post
Mike,

There are 2 tree control types:

1. single source - used with cube databases and we only support 3: SSAS, Essbase and SAP/BW. This tree control must be populated by a very specifically coded procedure as shown in our documentation.

2. multisource - this has layers that can be populated by a normal XML procedure and each layer "chains" to the next. For example, COUNTRY in layer1, CAR in layer 2, and MODEL in layer 3.


David Glick
Director WebFOCUS App Studio
and WebFOCUS Developer Studio
WebFOCUS Division
Information Builders, Inc.
Direct (917) 339-5560
Voice Mail (212) 736-6250 x3560
Fax (212) 947-5168
Email david_glick@ibi.com
 
Posts: 315 | Registered: April 13, 2004Report This Post
Guru
posted Hide Post
Thanks for the info! I was wondering if anyone could post a screen shot showing how they used the tree controls.

Mike


Webfocus 8
Windows, Linux
 
Posts: 258 | Location: Palm Coast, FL | Registered: February 05, 2010Report This Post
Expert
posted Hide Post
How does a single-source tree control 'know' that the external procedure containing WebFOCUS code is pointing to SSAS, Essbase or SAP/BW. Where is this documented? I see no mention of "SAS" and "Essbase" in the documentation "Designing a User Interface for a Web Application With the HTML Composer, Version 7 Release 7.03".

Please don't tell me I'm doing something wrong (again) by having my external procedure read an Oracle table.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
Francis,

Page 196 of the manual you reference states multidimensional datasource for example SAP BW that uses the parent/child model. That is how we describe cube data. There is also a note on the same page that says cube data should be sued to populate single source trees.

Page 198 at the top, shows the structure of what a procedure to populate a single source tree should look like.

Since we do not support an Oracle Cube, you should need to use a multisource tree for that data and multisource trees require at least 2 levels.


David Glick
Director WebFOCUS App Studio
and WebFOCUS Developer Studio
WebFOCUS Division
Information Builders, Inc.
Direct (917) 339-5560
Voice Mail (212) 736-6250 x3560
Fax (212) 947-5168
Email david_glick@ibi.com
 
Posts: 315 | Registered: April 13, 2004Report This Post
Expert
posted Hide Post
Thanks for pointing out the pages that describe Tree controls.

I suppose I read this "You may also use a tree control for non-hierarchical data sources" as meaning I can retrieve data from a simple Oracle table.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
Yes.


David Glick
Director WebFOCUS App Studio
and WebFOCUS Developer Studio
WebFOCUS Division
Information Builders, Inc.
Direct (917) 339-5560
Voice Mail (212) 736-6250 x3560
Fax (212) 947-5168
Email david_glick@ibi.com
 
Posts: 315 | Registered: April 13, 2004Report This Post
Expert
posted Hide Post
Why is the first value of the multi-select Tree control selected, even if I have Default Selection set to No?


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
quote:
Why is the first value of the multi-select Tree control selected, even if I have Default Selection set to No?


I witnessed this as well. We would never pass in the parent in our tree control so I had to use javascript to force it unselected as well as not make it selectable.


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Expert
posted Hide Post
Matt, I'm interested in seeing the JS you used to uncheck the checkbox. It resides in a table element that's part of a table that contains the tree control - did you write something to traverse the table > tr > td > table > tr > td ...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Virtuoso
posted Hide Post
Some jQuery magic may help there.

To uncheck any checkbox that may be checked within the tree one could simply do something like this:

$('input:checkbox:checked', '#mytreeID').attr("checked",false);


To specifically address the "parent" checkbox one could try something like this:

$('#yourTreeID>table>tbody>tr:nth-child(1)>td:nth-child(2)>label>input:checkbox').attr("checked", false);


Though the latter is very specific and probably more "efficient" than just looking for all input elements recursively within the tree as done in the first example, the syntax is not only complex but also fragile as IBI may decide to change the internal HTML rendering of the tree control in future versions of the product and that would cause the second jQuery selector to stop working.

As we are usually being discouraged from interacting directly with the DOM when trying to manipulate the HTML controls implemented with HTML Composer, it would really help having more IbComposer_* JavaScript utilities offering wider functionality than the 6 or 8 functions currently available in 7.7.03.

Until that happens, we'll have to resort to inspecting the DOM and playing around it but beware of future upgrades or even HotFixes!!!



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
 
Posts: 1533 | Registered: August 12, 2005Report This Post
Expert
posted Hide Post
Neftali,

Thanks for the jQuery suggestion, it worked:

$('input:checkbox:checked', '#compUid_14_table_0').attr("checked",false);

Translating jQuery to English, does this line mean "uncheck ALL checkboxes in the html element with id 'compUid_14_table_0'"? Or just the first one, though I doen't see and reference to only one checkbox.

Regards,


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Virtuoso
posted Hide Post
quote:
To uncheck any checkbox that may be checked within the tree one could simply do something like this:

$('input:checkbox:checked', '#mytreeID').attr("checked",false);


Yes. The jQuery expression looks for ALL checkbox controls but only those that are currently in a checked status (:checked) and then unchecks them via attr("checked", false).

To target particularly the very first element in the tree then a more specific syntax is required such us the ugly one below:

$('#yourTreeID>table>tbody>tr:first>td:nth-child(2)>label>input:checkbox').attr("checked", false);


This one would, in theory and at a high-level, search for *the* checkbox control (there is only one in each line of the tree) found in the second TD element (the first one is used to display the tree lines) within the first TR in the TABLE control created under the tree ID, and then uncheck it (whew!).

Again, I would not advise to use such a construct as it is highly dependent on the internal DOM representation of the tree and that is not guaranteed to remain the same across different WebFOCUS versions but may be an interesting exercise anyway Smiler

This message has been edited. Last edited by: njsden,



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
 
Posts: 1533 | Registered: August 12, 2005Report This Post
Guru
posted Hide Post
This is the js that I am using to unselect it and disable the checkbox for the parent tree. I have multple tree controls in my HTML.

 function onInitialUpdate() 
                {
                var ins = document.getElementsByTagName('input');
                for (var i=0; i<ins.length; i++) 
                                {
                                //if (ins[i].getAttribute('type') == 'checkbox') 
                                                {
                                                //ins[i].checked = false;
												if (ins[i].id == 'compUid_9_1_0_undefined') { ins[i].disabled = true; }    
												if (ins[i].id == 'compUid_9_1_0_undefined') { ins[i].checked = false; }    
												if (ins[i].id == 'compUid_10_1_0_undefined') { ins[i].disabled = true; }    
												if (ins[i].id == 'compUid_10_1_0_undefined') { ins[i].checked = false; }    
												if (ins[i].id == 'compUid_115_1_0_undefined') { ins[i].checked = false; }    
												if (ins[i].id == 'compUid_115_1_0_undefined') { ins[i].disabled = true; }    


                                //alert(ins[i].name + ' ' + ins[i].id + ' ' + ins[i].form + ' ' + ins[i].value);


                                                }
                                }

                }
 


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Guru
posted Hide Post
I would also be interested if you also tried using "Saved Parameters" with your tree control. I am interested in what values are saved when you have multple child nodes selected, does it select all the levels up to the parent when you pull up your saved report?

HF 6 was supposed to fix it and it does partially, but when you have 2 or more child nodes selected it selects all the levels of the hierarchy when you pull it back up.


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Expert
posted Hide Post
Matt, thanks for the JS. I've gone the jQuery route:

Select all:
$('input:checkbox', '#compUid_14_table_0').attr("checked",true);

Deselect all:
$('input:checkbox', '#compUid_14_table_0').attr("checked",false);

Of course, there's a lot more to do. I'd like to completely open and completely close the tree when selecting/deselecting all.

In my multi-select tree, the checkboxes are independent of each other - checking a parent does not check the children. This is what the customer wants and I certainly hope a future hotfix doesn't change this behaviour - this and others should be property options for the Tree control...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Expert
posted Hide Post
Select all:
$('input:checkbox', '#compUid_14_table_0').attr("checked",true);

Oh well, this only selects the checkboxes for some levels down - not all levels...


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Virtuoso
posted Hide Post
It should select all checkboxes within "#compUid_14_table_0". If that's the out-most element ID then it should work.

What happens if you first expand all of the nodes and then play with checking/unchecking them all with jQuery?



Prod/Dev: WF Server 8008/Win 2008 - WF Client 8008/Win 2008 - Dev. Studio: 8008/Windows 7 - DBMS: Oracle 11g Rel 2
Test: Dev. Studio 8008 /Windows 7 (Local) Output:HTML, EXL2K.
 
Posts: 1533 | Registered: August 12, 2005Report This Post
Expert
posted Hide Post
If I expand nodes and then trigger the jQ, they get checked. If I refresh the screen and have four check boxes visible and then trigger the jQ, the four visible ones get checked (funny, I thought selecting was going down at least one level, even if hidden, but I am wrong). Deselecting works - all checkboxes, hidden or not are deselected.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Expert
posted Hide Post
Ah ha! There's a difference between never un-collapsed and previously uncollapsed but now collapsed. The branches you open and close become known (to the DOM?) and then get selected even if they're closed.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
Got Webfocus 8 installed and to provide an update they did add some new functionality to the Tree Control

1. Added the Property of "Multple" so now you don't have to go to the parameters page and add a new Multiple OR paramater.

2. Added another Property of "Select all children" Whenever a Node in the Tree gets selected, all the dependant child nodes should become selected as well.

Now I haven't tested item #2 but I like the feature.

I do also see a slight issue on my end as it appears in version 8 they are pre-populating all the nodes in the tree control versus 7 where they would only pull the parent nodes and when you expanded a parent node then it would go out and retreive the child nodes. This is a performance issue for me so I need to figure out if there is some sort of toggle to not do this.

If anyone has any suggestions please let me know. I do have a case open on this.


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Expert
posted Hide Post
"in the tree control... they would only pull the parent nodes and when you expanded a parent node then it would go out and retreive the child nodes" - I didn't think this occurred, I haven't noticed any behaviour to suggest it.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
 
Posts: 10577 | Location: Toronto, Ontario, Canada | Registered: April 27, 2005Report This Post
Guru
posted Hide Post
I am pretty confident it behaves that way. I have a parent node that has over 3,000 child nodes at the next level. On initial load in 7.7 it comes up within seconds, but if I expand that parent node, then it takes about 20-30 seconds to display all those child nodes, where as it is different in version 8, where it is taking over a minute to build the entire hierarchy, but when you expand that same node after on load it takes a split second.


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
Gold member
posted Hide Post
I am trying to get this working. Should I add any specific .js files to get it working? and does #compUid_14_table_0' reference the first node?


WF: 7.6.8
OS/Platform: Windows, Unix
 
Posts: 55 | Registered: May 25, 2010Report This Post
Gold member
posted Hide Post
I am trying to use the jquery to fix my issue. I have a dynamic multi select tree control and am using the following query.

 
<SCRIPT type="text/javascript">
                $('input:checkbox:checked', '#compUid_1').attr("checked",false);
</SCRIPT> 


But I get an error that-
Object doesn't support this property or method. Am I missing something??


WF: 7.6.8
OS/Platform: Windows, Unix
 
Posts: 55 | Registered: May 25, 2010Report This Post
Guru
posted Hide Post
Try a little javascript. This is what I use

 function onInitialUpdate() 
                {
                var ins = document.getElementsByTagName('input');
                for (var i=0; i<ins.length; i++) 
                                {
                                    {
			if ((ins[i].name == 'compUid_9') && (ins[i].value=="Product")) { ins[i].disabled = true; ins[i].checked = false; }    
                                      //alert(ins[i].name + ' ' + ins[i].id + ' ' + ins[i].form + ' ' + ins[i].value);

                                    }
                                }
 


WebFOCUS 8.1.05
 
Posts: 496 | Registered: January 04, 2008Report This Post
  Powered by Social Strata Page 1 2  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     HTML Composer: How to make the Tree Control intelligent

Copyright © 1996-2020 Information Builders