|
hi,
I 'm really like this tree, it 's almost exactly what I want,but only one thing, I can't resize the column.
How can I do it?
-Thanks
|
|
|
|
|
That's because I haven't implemented column resizing functionality in this version. I might get around to it at some point, but don't hold your breath.
NATHAN RIDLEY
Web Application Developer
email: nathan @ netlab.com.au
[remove the spaces before and after the @ symbol]
|
|
|
|
|
When I create a node based on an XML file it seems that the node cannot be expanded automatically even if true is passed as the first parameter to TreeControlNode.
|
|
|
|
|
Hi.:
Can you helpme, how to adjust the table to fit on the screen like X%?
Thanks.
rtorres@bee.cl
|
|
|
|
|
I've uploaded updated code here that allows variable-width tables. One of these days I'll get around to updating the article. But for now, the link is:
test.hep10.com/treelistcontrol.zip
To make a table 100% wide, simply set one column width to null and the rest to a fixed width. The tree will then fill the width of its container.
NATHAN RIDLEY
Web Application Developer
email: nathan @ netlab.com.au
[remove the spaces before and after the @ symbol]
|
|
|
|
|
First I have to say:
Good work so far! Seldom I have seen such a well formatted code!
You should add an header with your Name and the WWW-url for the control so that anyone knows who's that big author!
Nevertheless I have two feature request:
1. I wondered if the control is working in Mozilla on my Linux box. The only thing (as I mentioned) that does not work is expanding/collapsing by clicking '+' or '-' and the flag to hide the title. Wouldn't it be great if the control is described with Cross-Browser Tree List Control v3.x?
2. Is there any way to enable Keyboard-Support?
I am looking forward to see any of this functionality in future releases. Thanks a lot!
Sorry my bad english.
Greetings
Florian
|
|
|
|
|
I'm experiencing a problem using the tree view script in the IIS environment. If I simply unzip the source into, say, c:\inetpub\wwwroot\v3 (I'm using V3),
modify the demo.htm as follows:
// var node8 = new TreeListControlNode (false,null,'http://top01wdt1:8090/workspace/test.xml');
// node8.setText('','','d','e','f');
// node7.add(node8);
var node8 = new TreeListControlNode(false,null,'test.xml');
node8.setText('test.xml','','g','h','i');
node7.add(node8);
and navigate to the site (e.g. http://localhost/v3/demo.htm I get an "Unavailable 405" error when attempting to expand the xml sourced node.
The IIS log indicated a POST 405 for test.xml has been requested. Can anyone tell me what I'm doing wrong? I've tried changing the code to:
var node8 = new TreeListControlNode(false,null,'http://localhost/v3/test.xml');
node8.setText('test.xml','','g','h','i');
node7.add(node8);
With the same results.
Thanks
|
|
|
|
|
I found that I had a problem shared with a prior poster (pobrob - RE: "Had to change Status to 200"). I too changed the status to 200. And all works with one other change (Which incidently is probably why that pobrob received the 405); you have to modify the test.xml file to not reference the http site(s) within test.xml- they don't resolve). Specifically:
"http://top01wdt1:8090/workspace/test.xml"
and
"http://top01wdt1:8090/web_api/images/icons/icon_user.gif"
Nathan:
Would you mind sending me the updated code you sent prorob?
Thanks.
BTW: Excellent article and work.
Dave Comer
|
|
|
|
|
I have received countless messages asking how to make this into a .NET tree, how to make it so it's built dynamically, etc. Have your server-side code generate the javascript required to build the tree you want! Read through your database using your server side scripting language of choice, and for each required node, dynamically write some javascript to the page which sets up that branch of the tree!
NATHAN RIDLEY
Web Application Developer
generalgherkin@yahoo.com
|
|
|
|
|
anybody knows how to populate a tree structure dynamically from SQL server database using vb.net ?
|
|
|
|
|
Every time I try and add src to the icon for the root or subsequent nodes I just get an empty box... do the gifs have to be a precise size... or am I missing something?
Can someone provide an example.
Thanks
|
|
|
|
|
I want create the tree control from database, so I 'll create the xml file first. (Who has better method?)
Do you have any java codes to do this?
Thanks a lot!
|
|
|
|
|
|
I am still getting a freeze up. It gets all of the data fine, but then when recalcing images, it stops at seemingly random nodes . I used the updated code you sent but I am still getting freeze ups. I used your debugging statements and found that putting them in made the problem go away, probably because it introduced a delay. I began removing the debug statements and when there were just a few left in recalcimages the problem began to appear again. Any ideas?
|
|
|
|
|
What version of IE are you using? Also do you know what version of MSXML you are using. I had to modify the treeviewcontrol.js file to make it work in 5.5 but I am getting this same freeze up problem too.
Thanks
|
|
|
|
|
I was using IE 5, 5.5 and 6.0. Also with MSXML 2 and 3. I suspect I know what the problem is related to. I think it is due to the fact that the web server is not caching the images because the images are added dynamically. None of the preloading tricks seems to prevent this. Adding several very small gif images seems to cause the problem. I have found a few reference to this type of problem. I don't really have a solution that doesn't screw up the performance of the tree. Putting a bunch of statements that delay things at the bottom of recalc_images helped it but did not solve it completely. The following
http://www.webmasterworld.com/forum21/6334.htm
describes a similar problem. He solved it by calling his function with a set-timeout 0 which would launch each in a separate thread. Perhaps calling recalc-images that way would work.
Let me know what you find.
|
|
|
|
|
I had the same problem - when loading a dynamic node, at some point it would get stuck with IE just sitting there. It seemed to happen once you got to a certain level of nesting in the tree.
I took a look at the code of the xmlCallBack and saw that every node was calling recalcImages and recalcChildImages on itself as it was added (in the node.add function). This is not needed if you simply add a recalcChildImages to the xmlCallBack function, like so:
<br />
TreeListControlNode.prototype.xmlCallback = function() {<br />
var failed;<br />
var errormessage;<br />
if(this.xmlhttp.readyState == 4)<br />
if(this.xmlhttp.status==200) {<br />
var xml = new ActiveXObject("Microsoft.XMLDOM");<br />
if(xml.loadXML(this.xmlhttp.responseText)) {<br />
failed = false;<br />
this.firstChild.remove();<br />
if(xml.documentElement) {<br />
this.addXMLChildNodes(xml.documentElement, this);<br />
}<br />
this.recalcImages();<br />
this.recalcChildImages();<br />
} else {<br />
failed = true;<br />
errormessage = 'XML parse error ' + xml.parseError.errorCode + ' (' + xml.parseError.reason + ') at line ' + xml.parseError.line;<br />
}<br />
} else {<br />
failed = true;<br />
errormessage = this.xmlhttp.statusText;<br />
}<br />
if(failed) {<br />
this.firstChild.setColumnText(this.oTree.nLabelColumn, '<span style="color:red">Unavailable - ' + this.xmlhttp.status + ' - ' + errormessage + '</span>');<br />
this.firstChild.useIcon = false;<br />
this.firstChild.recalcImages();<br />
}<br />
}<br />
<br />
TreeListControlNode.prototype.addXMLChildNodes = function(xml, oParent) {<br />
var showchildren, refkey, xmlsrc, xmlparms, onclick, iconsrc;<br />
if(xml.childNodes.length > 0) {<br />
var x = xml.lastChild;<br />
while(x) {<br />
showchildren = x.getAttribute('showchildren');<br />
if(!showchildren) showchildren = false;<br />
else showchildren = (showchildren == 'yes' ? true : false);<br />
refkey = x.getAttribute('refkey');<br />
if(!refkey) refkey = null;<br />
xmlsrc = x.getAttribute('xmlsrc');<br />
if(!xmlsrc) xmlsrc = null;<br />
xmlparms = x.getAttribute('xmlparms');<br />
if(!xmlparms) xmlparms = null;<br />
onclick = x.getAttribute('onclick');<br />
if(!onclick) onclick = null;<br />
iconsrc = x.getAttribute('iconsrc');<br />
if(!iconsrc) iconsrc = null;<br />
var node = new TreeListControlNode(showchildren, iconsrc, xmlsrc, xmlparms, refkey);<br />
node.onclick = onclick;<br />
for(var i=0; i<x.childNodes.length-1; i++)<br />
try {<br />
node.setColumnText(i,x.childNodes[i].firstChild.nodeValue+'');<br />
} catch(e) {}<br />
if(oParent.firstChild)<br />
oParent.firstChild.insertBefore(node, true);<br />
else<br />
oParent.add(node, true);<br />
if(x.lastChild.childNodes.length > 0)<br />
this.addXMLChildNodes(x.lastChild, node)<br />
x = x.previousSibling;<br />
}<br />
}<br />
}<br />
It all works fine now!
|
|
|
|
|
Hi
first of all, I've to say Great Job you did with that tree control. I know I'm not the first to tell you that, but it's really just great.
Unfortunatly I'm encountering a problem that I don't really understand.
I'm using the tree to display certain elements of an XML File. The XML File has an XSL Stylesheet that contains a reference to a Javascript file. The XML File is parsed by my Javascript and a recursive function within adds nodes to the tree.
That all works fine and the tree is shown in my Internet Explorer Window.
In my Page created by the XSL Stylesheet there is also a button to change the current view. (i.e. display all data, display filtered data). One of the functions is a Print Preview function that should open a new Internet Explorer Window and display the tree just in a different position of the window.
So here's my problem:
Normally I create the code for the new Explorer Window by defining a string within my Javascript and add HTML Code to that string. Afterwards I use the Javascipt function document.write(string) to write the string to the new window and the html code is displayed. If I try to do that with my tree I get the following error:
"TreeListControlHandler.allTrees.6.showRootNode is Null or no Object"
I have no Idea what this error means or how to fix that. Maybe anyone of you knows. Would be really glad.
My Code that doesn't work looks like this:
------------------------------------------
F1 = window.open ( "about:blank", "Print_View_Window", "width=700,height=650, left=0, top=0, scrollbars=yes, menubar=yes, toolbar=no, location=no");
F1.focus();.
.
.
var tree = new TreeListControl('Test Tree','../../../dtd_xsl/tlcimages/my_icon_folder.gif', false, false);
//tree.addColumn ( new TreeListControlColumn(20, '') );
tree.addColumn ( new TreeListControlColumn(20, '', true) );
tree.addColumn ( new TreeListControlColumn(310, 'Stepnr') );
tree.addColumn ( new TreeListControlColumn(45, 'Status') );
tree.addColumn ( new TreeListControlColumn(65, 'Lower Limit') );
tree.addColumn ( new TreeListControlColumn(90, 'Measurement') );
tree.addColumn ( new TreeListControlColumn(65, 'Upper Limit') );
tree.addColumn ( new TreeListControlColumn(55, 'Unit') );
tree.rootNode.setText('','Begin Test Results','',' ');
tree.nLabelColumn = 1;
recursive_BuildTreeForPrintView(xmlroot.firstChild,tree.rootNode,my_string);
my_string += tree;
.
.
.
F1.document.write(s);
F1.document.close();
My Code that works looks like this:
-----------------------------------
var tree = new TreeListControl('TestTree', '../../../dtd_xsl/tlcimages/my_icon_folder.gif', false, false);
//tree.addColumn ( new TreeListControlColumn(20, '') );
tree.addColumn ( new TreeListControlColumn(20, '', true) );
tree.addColumn ( new TreeListControlColumn(310, 'Stepnr') );
tree.addColumn ( new TreeListControlColumn(45, 'Status') );
tree.addColumn ( new TreeListControlColumn(65, 'Lower Limit') );
tree.addColumn ( new TreeListControlColumn(90, 'Measurement') );
tree.addColumn ( new TreeListControlColumn(65, 'Upper Limit') );
tree.addColumn ( new TreeListControlColumn(55, 'Unit') );
tree.rootNode.setText('','Begin Test Results','',' ');
tree.nLabelColumn = 1;
recursive_BuildTree(xmlroot.firstChild,tree.rootNode);
my_string += tree;
DisplayData.innerHTML = my_string;
So the only difference in the code that doesn't work is that I attempt to write the tree to a new Explorer Window instead of writing to the current window.
This Error also occurs when I delete the call of the recursive function, so it has nothing do do with that.
Hope anyone has a clue how to fix it and get it to work.
Hopefully there's a workaround for that problem.
Thanks in Advance,
Mathias
|
|
|
|
|
Could it be that the code is being evaluated in the context of the new window, rather than the existing window, hence TreeListControlHandler.allTrees.6.showRootNode is not defined within that context? Just a thought
|
|
|
|
|
Thanks for answering,
but doesn't the code has to be evaluated in the new Window to display the tree there (in the new window)?
You think I should evaluate the code in the existing window, right? But if I evaluate the code in the existing window, it builds the tree into the existing window which I already have working in another function also mentionend in my question before.
So how do I define the tree or "TreeListControlHandler.allTrees.6.showRootNode" in my new window? Any ideas?
Or am I wrong at that point that I have to do that? Or do I just don't see the wood for the trees?
Appreciate any help on that.
Mathias
|
|
|
|
|
I think I sort of understand what it is you're trying to do. I can see two things that might cause a problem...
1st, try giving your tree a string id, as opposed to a numeric id. "TreeListControlHandler.allTrees.6.showRootNode" is syntactically incorrect because "6" can't be interpreted as a variable.
2nd, have you made sure your popup window actually has access (i.e. a script tag referencing the file) to the treelistcontrol.js file. If you insert jscript code into a popup window, it is not going to automatically have access to all the included jscript code that you have in the calling window.
NATHAN RIDLEY
Web Application Developer
generalgherkin@yahoo.com
|
|
|
|
|
That was partly a solution.
I already included the treelistcontrol.js file in my new window but I just forgot to include the stylesheet too. For that all my data looked scrambled.
So now I have a well looking tree in my new popup window with all the data I need but the problem with the "TreeListControlHandler.allTrees.6.showRootNode is null or no object" MessageBox remains. Actually I just discovered that there are several different error messages in the following order:
2 x TreeListControlHandler.allTrees.6.showRootNode is null or no object
1 x TreeListControlHandler.allTrees.6.showColumnHeadings is null or no object
1 x TreeListControlHandler.allTrees.6.showRootNode is null or no object
1 x TreeListControlHandler.allTrees.6.showColumnHeadings is null or no object
These five error messages occur when the new window is loaded. After that I see my tree, but if I move over the treecontrol with my mouse the errors occur again.
So i.e. I can't expand the tree in the new window.
Additionally if I call my function to display the tree in the new window again the error message changes to:
TreeListControlHandler.allTrees.12.showRootNode is null or no object"
The third time I call that function it changes to:
TreeListControlHandler.allTrees.18.showRootNode is null or no object"
and so on...
I didn't change anything on the original treelistcontrol.js code so far, so that "6" is generated by the treecontrol itself.
If I change the ID in function TreeListControlHandler from 0 to "0" (to a string) nothing changes.
If that might be a problem having a string ID or not, could anyone provide the place where to change that for I'm not sure where and how to do that?
Any other ideas what could call this error messages and how to fix that problem?
Mathias
|
|
|
|
|
I don't mean change the subtype of the variable to string, I mean use an actual non-numeric string for the variable. Instead of using "12", use "ID12", or something like that.
NATHAN RIDLEY
Web Application Developer
email: nathan @ netlab.com.au
[remove the spaces before and after the @ symbol]
|
|
|
|
|
We found that when we moved the Tree control into a Web, we had to change the status check from 0 to 200. In this case we are calling an ASP page to return the XML. We are also seeing a random freeze up on expanding the tree. I don't know if this is related. It times out after about 5 minutes and then just shows blank icons. This was on a few IE6/XP machines .
Here is the change we made. Any ideas on the freeze up?
TreeListControlNode.prototype.xmlCallback = function() {
var failed;
alert(this.xmlhttp.readyState + ":" + this.xmlhttp.status);
if(this.xmlhttp.readyState == 4)
if(this.xmlhttp.status==200) {
var xml = new ActiveXObject("Microsoft.XMLDOM");
if(xml.loadXML(this.xmlhttp.responseText)) {
failed = false;
this.firstChild.remove();
if(xml.documentElement) {
this.addXMLChildNodes(xml.documentElement, this);
}
Brooks
|
|
|
|
|
I've fixed the freeze-up in the latest version. I found, after days of ripping my hair out, that it was an IE-based bug based on using a css class that had no styles declared.
e.g.
.myclass {}
I have emailed you the updated code. Note that it also has some other updates too, like if you leave one column with set to null, the tree will fill the width of its container.
NATHAN RIDLEY
Web Application Developer
generalgherkin@yahoo.com
|
|
|
|
|