1. HOW TO expand and collapse branch by clicking on text?

Just add function onclick='ob_t23(this)' to the text.
Example:

2. HOW TO open Tree in Search pane?

Open example

You can open any file in Search pane with link attribute TARGET. Example:
    <A HREF='page.asp' TARGET='_search' ID='aTreeLink'>Page</A>

To open Search panel on window_onload with JavaScript:   aTreeLink.click();

To open all links FROM Search pane into main window use in page header:
    <BASE TARGET='_main'>
or use different targets in each link individually
    <A TARGET='_main' HREF='...
    <A TARGET='frame-name' HREF='...

3. HOW TO install component on shared hosting server?

Many hosting services already have it installed.
Make request to Customer Service of your hosting service.
They will install component for you.

For .NET you can just put dll into your web application BIN folder.
Create BIN folder if you don't have it there.

4. HOW TO populate the Tree from a database query?

Download Example.
See section Database from Default.aspx in the zip file
with working files and small MS Access .mdb database.

In ASP 
    
SQL = "SELECT * FROM myTable ORDER BY ParentId, ChildId"



Do Until Rs.EOF
        oTree.Add Rs("ParentID"), Rs("ChildID"), TEXTorHTML
        Rs.MoveNext
Loop

For ASP.NET

SQL = "SELECT * FROM myTable ORDER BY ParentId, ChildId"



Do While MyReader.Read()
        oTree.Add(MyReader("ParentID"), MyReader("ChildID"), TEXTorHTML)
Loop

---
Important TIP 1: The only correct way to populate
any treeview from database is to use field Level_Index.
If you have column with some kind of tree deep Level Index, then your life will be very easy.
Just use query with ORDER BY Level_Index.
This way parents always will be populated before children.

Here is small project with source code obout_DBTree_Level.zip (99KB) to assign Level_Index.
Zip file has projects written in VB6, VB.NET and C#.
It has ready asp/aspx files and demo.mdb database to make treeview with 800 nodes.
---

TIP 2: Try to set oTree.ShowLostRed = true
You will see children nodes added before their parents in red color.
This new property was added in dll version 2.0.14 and very useful for debugging.

5. I populate Tree from database and there are no nodes.

1. Please, pay attention, that parent should be added before child.
Don't add child before parent! :)

Try to set
oTree.ShowLostRed = true
This property is useful for debugging.
You will see children nodes added before their parents in red color.

2. First level should have parent "root". Example:
     oTree.Add("root", "a123", "Hello, World!")

3. If you want node without parent to be added to the root by default, set
oTree.ShowLost = true

4. Download Example.
See folder \Examples\ with working examples.
Try to make little changes. Play with tree.
You will get a better idea how to populate the tree.

6. Error "Can't create object" or "The object has an invalid ProgID".

First, check security permissions directly in dll files. Give rights to Everyone.
Second, check if your MSXML works.
Create test ASP page with this code. See if you get the same error.

<%
        Set oXML = Server.CreateObject("MSXML2.DOMDocument")
        Set oNode = oXML.createElement("tag")
        oNode.text = "MSXML is working OK"
        oXML.appendChild(oNode)
        Response.Write oXML.childNodes(0).text
 %>

One developer fixed MSXML3 by installing IE 6.0 on server machine.
IE 6.0 has latest MSXML3 and other DLLs.
You can also reinstall MSXML3. See Microsoft MSXML3 page.
Also see Can not register dll with regsvr32.

7. HOW TO add ToolTip to node?

HTML elements have attribute TITLE. It's your ToolTip.

8. Error "Cannot use parentheses when calling a Sub"

You probably have VBScript code on the page. Tree has JavaScript for cross-browser compatibility.
Just copy-paste your VBScript to the end of your page and it should work fine.

9. I load sub tree dynamically, but sub tree doesn't collapse.

1. The file that creates the subtree must contain only the html source of the subtree.
There should be only the Response.Write(oTree.HTML()) method.
This html code will be used to create the dynamically loaded nodes in the main tree.
If there are other HTML elements (beside the HTML code of the subtree) errors will appear.
Download Example. See section Loading (in Default.aspx) with dynamic loading examples.

To test your code open dynamic sub tree in separate window as stand alone file.
Make right click on page, select View Source. Check if there any HTML code above or below tree.

2. Make sure first level nodes have parent id "root" (lower case).
Sub tree is populated the same way as a main tree.

10. Server.CreateObject failed while checking permissions. Access is denied...

For ASP give Full rights to Everyone directly in dll files.
For ASP.NET give Full rights to user {machine-name}/ASPNET.
On Windows 2003 give Full rights to users NETWORK, NETWORK SERVICE, INTERNET SERVICE.

Open Windows Explorer. Right click on dll -> Properties -> Tab 'Security' -> Click 'Add'.

If you don't have tab 'Security' on Windows XP, open Windows Explorer, and choose Folder Options from the Tools menu.
On the View tab, scroll to the bottom of the Advanced Settings and clear (click) the check box next to "Use Simple File Sharing."
Click OK to apply the change. You should now have a Security tab.

If dll permissions did't help, give full rights to C:\Windows\System32\msxml3.dll
and C:\Winodows\System32\MSVBVM60.dll
First dll is Microsoft MSXML3 and second is Microsoft Visual Basic 6 run time dll.


If page is running OK and you have error "Access is denied" only occasionally,
see Microsoft Knowledge Base Article - 329065

11. HOW TO remember selected node after reloading the page?

Add QueryString with Node ID to the node link.
Example:
    html = "<a href='mytree.asp?id=a33'>Hello, World!</a>"
    oTree.Add(ParentID, ID, html);
    
Add this line to server side code:
    oTree.SelectedID = Request.QueryString("id")

Tree will be expanded down to selected node automatically.
Node ID is the second parameter in method Add oTree.Add(ParentID, ID, html);

12. HOW TO make nodes expanded? My tree is always collapsed.

Method Add has optional parameter Expanded (True or False)

Example collapsed and expanded nodes:
    oTree.Add("c23", "c23_4", "Hello", False)
    oTree.Add("c23", "c23_5", "Hello", True)

Default is True (Expanded). See Method Add.

13. Can not register dll with regsvr32.

To use treeview in Classic ASP,
run this command (click button Start > Run)

regsvr32 "C:\<PATH TO DLL>\obout_ASPTreeView_2.dll"

If you get unsuccessful message:
1. You misspelled the path.
2. You misspelled name of the dll.
3. You misspelled regsvr32 (regsrv32 - wrong).
4. You misspelled the path and name of the dll (the most common case).
    about_ASPTreeView_2.dll - wrong.
    obout_ASPTreeView_2.dll - correct.
5. You are registering dll which ends on "..._NET.dll".
    Do NOT register it. This dll is not for Classic ASP.

14. HOW TO retrieve tree selected ID?

Use variable tree_selected_id on the client side JavaScript.
Example: 
    alert(tree_selected_id);
See example
 
To show node text:
    alert(document.getElementById(tree_selected_id).innerText);
    
Feel free to edit JavaScript file \tree2\ob_tree_XXX.js
See function ob_t22(ob_od)

15. HOW TO delete old version and install full version?

Search your hard drives for obout_asptreeview*.dll and delete all.
Make sure you are searching on the correct machine.
Then install the full version.

If access is denied when you delete dll, do this:
    1. Close InterDev and all other apps with references to dll.
    2. Open IIS MMC. Open Properties for your web site.
    3. Open tab 'Home Directory' and click button 'Unload'.
Now unregister and delete dll. If it doesn't help, reboot PC and delete file. 

On Windows 2003 click Start > Run > type IISReset.exe > Press OK > After reset replace dll.
or
On Windows 2003 go to IIS > Application Pools > Restart DefaultAppPool > Replace dll.

16. HOW TO prevent breaking the line if node text is too long?

Use tags <NOBR>.
Example:
    html = "<NOBR>Loooooooooong Teeeeeeeeeext</NOBR>"
    oTree.Add(ParentId, ChildId, html)
    
If you want to apply it to all nodes, then edit CSS file
        td.ob_t2 {
                white-space:nowrap;
        
        td.ob_t3 {
                white-space:nowrap;

See Customize page for more information.

17. Error in msxml3.dll "This name may not contain this character"

It is kind of a standard in XML (and HTML) that
    1. IDs should start with character.
    2. IDs can't have some symbols and spaces.
Replace symbols and spaces with characters or underscores in IDs.
It is definitely not recommended to use file paths as IDs.

18. HOW TO open pages in different frame by clicking on tree?

Links can have attribute TARGET='frame-name'.
Example:
    html = "<a href='page.aspx' TARGET='frame-name'>Hello!</a>"
    oTree.Add(ParentId, ChildId, html)
You can also use TARGET in page header and all your links will open in that frame. Example:
<head>
        <BASE TARGET='frame-name'>
</head>
<body>
. . . 

You can also use Splitter instead of frames. See Loading pages with Splitter

On our site we have left tree and right content on one page.
On each page we just set oTree.SelectedId = "how_to"
More...

19. HOW TO add HTML elements to the node?

You can put any HTML tags inside the nodes - checkboxes, textboxes, tables, images, etc.
Example:
Link
    html = "<a href='http://www.obout.com'>obout</a>"
Checkbox
    html = "<input type='checkbox'> MORE HTML HERE"
    oTree.Add("root", "n1", html)

    ' To prevent highlighting the nodes.    
    oTree.SelectedEnable = false

See example with checkboxes.  See example from Dennis.

20. HOW TO find and select (highlight) specific node?

On server
    oTree.SelectedId = "a123"
Tree automatically expands down to selected node. See Properties.
 
On client
        ob_SelectedId("a123");
         or
        ob_t26('a123');
Tree automatically expands down to selected node.

To scroll to selected node, use JavaScript on client side:
    document.getElementById(tree_selected_id).scrollIntoView(true);

21. What if I don't want to select node? I have HTML elements in the nodes.

Not to run script for highlighting selected Node, set
    oTree.SelectedEnable = False

See Properties.

22. HOW TO add scrollbars?

Set Width and/or Height. Scrollbars will be added automatically.
You can set width and height in pixels "200px" or percents "100%".

Example:

   oTree.Height = "500px"
    oTree.Width = "200px"
    oTree.Width_ScrollWider = "400px" (optional)
    
NOTE: Width_ScrollWider should be wider than Width.

23. HOW TO open PopUp window by clicking on node?

html = "<span onclick=""fnPopUp('sample.aspx')"">Sample PopUp</span>"
oTree.Add(ParentId, ChildId, html)

Write code in function fnPopUp to open a new window.

24. HOW TO remember tree expanded-collapsed state?

Treeview can remember state for each user individually.
Just add one line like here  Example Keep State.

25. Where to put folder 'tree2' ?

You can put folder 'tree2' to any location in your web directory.
To generate correct path in these properties go to this page

oTree.FolderIcons
oTree.FolderStyle
oTree.FolderScript

NOTE: If you updated DLL to a newer version, please update folder 'tree2'.
Do not replace. Delete old folder first, then copy a new one.

26. HOW TO improve performance?

The treeview is by far the fastest on the market.
It is much faster than any 3rd party treeview 
and much faster than MS Visual Studio treeview.

You can use several things to make it even faster.

1. Test your database queries.
Try to replace oTree.Add(ParentId, Id, html) with
Response.Write(Id & " - " & html & "<br />")

See how fast is your page without treeview.
Use indexes on tables to speed up queries.

2. Use in queries "ORDER BY Level_Index".
See Important TIP 1 here for more details.

3. Load large branches dynamically.
It is really easy.
See How to load dynamically

4. Disable VIEWSTATE for the treeview.
Page size will be 2 times smaller.
See How to disable Viewstate

27. HOW TO exapand or collapse all nodes at once?

See example page. Use these functions:

    <input type=button value="Expand All" onclick="ob_tall(1);">
    <input type=button value="Collapse All" onclick="ob_tall(0);">

28. HOW TO select node if it is in dynamically loaded file?

You will need to list all nodes from top level to selected node.
Use list of Node IDs with commas. Example 

oTree.SelectedId = "a0,b0,c0,z0,z1,z2,z3,z44"

NOTE: Each Node ID must be unique.
TIP: If first nodes from top are expanded, then you can omit them.
Start with closed (collapsed) nodes.

See deep tree Example.

29. HOW TO prevent caching? My data is updated frequently.

See example files with sub tree in section Loading 

(in the Default.aspx file from the zip file)

Put these 3 lines first on page

    ' These 3 lines prevent from browser caching. They are optional.
    ' Useful when your data changes frequently.
    Response.AddHeader("pragma","no-cache")
    Response.AddHeader("cache-control","private")
    Response.CacheControl = "no-cache" 
    

Also you might want to see this link
HOW TO load dynamically tree EVERY time I open it?

30. HOW TO show File System with files and folders on my hard drive?

See examples in section File System - from the zip file.
Place this file into any directory, it will show all files and folders automatically.
Pretty cool!  See example on our server

If you have large number of files, use dynamic loading (examples FileSystemBIG.asp/aspx and FileSystemSub.asp/aspx)
See example with dynamic loading. It is lightning fast with any number of files.

Download component with examples

31. HOW TO load dynamically tree EVERY time I open it?

Edit JavaScript file located in folder tree2/script/ob_tree_XXXX.js.
Comment out one line of code in function ob_t21(os, url):
          
    if (s != "Loading ...") {
        ...
        //    return;
    }

For more custom solutions click here

32. HOW TO edit JavaScript file?

You can edit the JavaScript files located in the "tree2/script" folder.
(ob_tree_xxxx.js, ob_events_xxxx.js and ob_mdn_xxxx.js)
XXXX is the version number (Treeview version 2.0.33 has file ob_tree_2033.js etc.)
See comments in the Javascript file and feel free to edit.

You can add your Javascript to any of Client side events.
See Server side events.

You can change a lot of how the treeview looks. See page Customize.

33. HOW TO set non-English language for sub tree?

See comments in ready working examples in zip file in folder /Loading
Select your language encoding settings in MSDN. 
Example:
Response.CodePage = 1252
Response.CharSet = "windows-1252"

34. HOW TO run examples?

How to install the component

For Classic ASP and ASP.NET 1.1

Unzip ASPTreeView.zip  anywhere on your hard drive.

Open the folder where you unzipped the file and run
the setupExamples.exe program. This will create a new
virtual directory in IIS and will open in a new browser
window a page with links to all the examples for C#/VB.NET/Classic ASP


For Visual Studio 2005

> File > Open > Website > 
> Select the folder where you unzipped ASPTreeView.zip and click Open
> Right click the Default.aspx file in Solution Explorer and set it as start page
> Right click the project name in Solution Explorer and select View in Browser
> From the list in the web page that opens, click the example you want to see.

Please ask any questions  support@obout.com

How to give security rights (see question 10) if access denied.


TIP: How to add reference to dll in Visual Studio project?

Go to toolbar menu Project > Add Reference > Click button 'Browse' >
> Find obout_ASPTreeView_2_NET.dll > Click 'Open' > Click OK

36. HOW TO load nodes dynamically on demand?

Just put URL of external file as last parameter.
oTree.Add(parentId, Id, html, null, null, "SubTree.aspx");

See working examples in the Loading section (Default.aspx from the zip file)
See examples: MSDN, Classic, Web

HOW TO load dynamically from database?
HOW TO select node in dynamically loaded branch? See Example

37. HOW TO call my function when node is selected?

Open file /TreeView/Icons/ob_tree_XXX.js
Insert your code at the bottom of this function

    function ob_t22(ob_od) {
       ....
       call your function here
    }

38. HOW TO make checkbox checked?

Use attribute CHECKED. Example

html = "<input type=checkbox id=chk_123 CHECKED>"
oTree.Add(ParentId, Id, html)

39. HOW TO drop without expanding target branch?

Edit file tree2/script/ob_mdn_xxxx.js

Replace the following code:
o_t.className="ob_t5";
with this line:
o_t.className="ob_t5";var o2_L=1;

Then replace this line:
if ((s=="usik.gif") || (s=="ik_l.gif")){o_t.onclick(); }
with this one:
if (o2_L!= null){o_t.onclick(); }

40. HOW TO change warning messages text when drag-and-drop?

Edit file tree2/script/ob_mdn_xxxx.js
You will see lines with warning messages. Feel free to edit.
Change text, comment out or delete those lines.

41. HOW TO load dynamically from database?

If node has children, set last parameter [SubTreeURL]. (See method Add)
Plus-Minus sign will be shown automatically.
You can add QueryString to SubTreeUrl with node ID.
Example "sub.aspx?id=" & ChildId
Then you can use one sub page on server with query "WHERE NodeID = "
Got the idea?
Build main tree first.
Then you can use one dynamic page for all your sub trees.

TIP: If sub page does not return any records, you can return some text. Example
Response.Write ("<div style='padding-left:10px; background-color:#eeeeee;'>(Empty)</div>")

42. HOW TO to customize drag-and-drop behavior?

When dragging a node, the children of the moving node are displayed too.
You can turn this feature on/off, by setting a javascript variable to true or false.
Open the ob_mdn_xxxx.js file (located in the tree2/script folder).
At the top you have:

    
    /// false - when dragging show moving node itself without children.
    /// true - when dragging show moving node with children.
    var show_with_children = true;

To highlight the nodes over which you drag the moving node, set the ob_HighlightOnDnd
variable (located in the same file) to true:

        
    var ob_HighlightOnDnd = true; // highlight the nodes under the moving node

43. Which browsers support dynamic loading?

On Windows it works fine in IE, Netscape, Mozilla Firefox, Safari, Opera 8.5, etc. Dynamic loading is using XMLHTTP object.
Opera introduced full support for this object only with release of Opera 8.5.
Also Microsoft doesn't let MAC to run MSXMLHTTP in IE.
It works fine on MAC in Safari, Netscape, Mozilla Firefox though.

To determine if dynamic loading is supported you can put this javascript anywhere below tree

if (ob_alert2==true) {
    // xmlhttp is not supported. Put your alert or code here.
}

On server side see these links from Microsoft