ASP.NET TreeView - How-To and Help

For any questions send us a support request.

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

Just add function onclick='ob_t23(this)' to the text.
    html = "<span onclick='ob_t23(this)' style='cursor: pointer;'>Company</span>"
    oTree.Add("root", "a2", html, false, "mydoc.gif")

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:;

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.
SQL = "SELECT * FROM myTable ORDER BY ParentId, ChildId"

Do Until Rs.EOF oTree.Add Rs("ParentID"), Rs("ChildID"), TEXTorHTML Rs.MoveNext Loop
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.

Have a look over the "cs_Demo.aspx" / "vb_Demo.aspx" files from the oboutSuite / ASPTreeView folder. These samples contain treeviews populated from a database.

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"
        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.
    html = "<A HREF='smart.aspx' TITLE=' ToolTip is here! '>Hello</A>"
    oTree.Add(ParentId, ChildId, html)

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.
    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.

Note for 64-bit machines.
regsvr32 for 64-bit is the default and located in: \Windows\system32
You need regsvr32 for 32-bit and it is located in: \Windows\syswow64
Confusing? Type path to regsvr32 like here:
"C:\Windows\syswow64\regsvr32.exe" "C:\path-here\obout_ASPTreeView_2.dll"

Microsoft KB article about 64-bit here

14. HOW TO retrieve tree selected ID?
Use variable tree_selected_id on the client side JavaScript.
See example
To show node text:
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.
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>.
    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 {
        td.ob_t3 {

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'.
    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:
        <BASE TARGET='frame-name'>
. . . 

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"

19. HOW TO add HTML elements to the node?
You can put any HTML tags inside the nodes - checkboxes, textboxes, tables, images, etc.
    html = "<a href=''>obout</a>"
    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
Tree automatically expands down to selected node.

To scroll to selected node, use JavaScript on client side:

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%".


   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. 
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  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 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.

For any questions send us a support request

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:
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
Detecting browser types in Web Forms
How To Determine Browser Type in Server-Side Code Without the BrowserType Object in ASP.NET

44. HOW TO update tree on server after drag-and-drop?

Send to server and process variable tree_dd_id. More info
You can use our new AJAX Page component without reloading page.

The new server-side events of the TreeView allow you to easily update
the tree after each drag-and-drop.If the OnNodeDrop event is enabled:
oTree.EventList = "OnNodeDrop"; then the Postback4 control will send the ids of the
dragged node and its new parent to the server for further processing.

For more information see the Server-side events page.
You can download an example that implements this feature using also
the new Tree_DB control.

45. Does drag-and-drop work with dynamically loaded nodes?

Yes, the drag and drop feature is available also for dynamically loaded nodes.

46. ViewState in aspx page is not used. How to disable ViewState?

To disable Viewstate for the entire page, set the EnableViewState attribute of 
the @Page directive of the ASP.NET page to "false":
   <%@ Page EnableViewState="false" Language="vb" %>

You can also disable Viewstate at the control level.
It will disable ViewState only for TreeView and will not affect any other controls.
   <ASP:Literal id="TreeView" EnableViewState="false" runat="server" />

47. HOW TO select node and do not expand it?

Open JavaScript file ob_tree_XXX.js in folder you set by property 
oTree.FolderScript = "tree2/script"

Find function ob_t25(ob_od)
Delete or comment out one line
//       e.onclick();

Also if you don't want the tree to expand from root down to selected node,
find function ob_t20(e)
Delete or comment out one line
//       os.onclick();

48. HOW TO select node in left frame by clicking on right frame?

In right frame call function in left frame for selecting node.

NOTE: Node ID should be unique or function will not work.

To scroll to selected node, use JavaScript on client side:

49. HOW TO customize treeview just on one page?

See page Customization Tutorial. It is easy to customize the TreeView.
What to do if you want to custmomize the treeview on one page
and want to leave treeviews unchanged on other pages?
TreeView style sheet is located in folder you set by property
oTree.FolderStyle = "tree2/style/Classic"

Copy that folder and Paste with new folder name like 'ClassicNew'
Then set
oTree.FolderStyle = "tree2/style/ClassicNew"

Now you can customize treeview by editing CSS file in ClassicNew folder.
It will not affect styles on other pages.

50. HOW TO expand/collapse by double click on icons?

1. Add function ob_t2dc to icon attribute like this
oTree.Add("a0", "b2", "Hello", false, "folder.gif\" ondblclick=\"ob_t2dc(this)" )

oTree.Add("a0", "b2", "Hello", false, "folder.gif"" ondblclick=""ob_t2dc(this)" )

Pay attention to double quotes.
You can also use single click event - onclick.

2. Add function ob_t2dc to JavaScript file tree2/script/ob_tree_XXX.js
function ob_t2dc(e) {
    // To expand-collapse on double click on icon.

51. Error "obout_ASPTreeview_2_NET namespace could not be found"

1. Use capital 'V' in obout_ASPTreeView_2_NET.

2. Add reference to obout_ASPTreeView_2_NET.dll in your Visual Studio project.
Go to toolbar menu Project > Add Reference > Click button 'Browse' >
> Find obout_ASPTreeView_2_NET.dll > Click 'Open' > Click OK

52. When keeping state, how to set cookies expiration period?

Edit file tree2/script/ob_tree_XXX.js
function ob_saveNodeState( objBlockNode, NodeId ) {
    // Set expiration days here
    var expiredays = 3;
    . . .

53. HOW TO drag-and-drop if using DOCTYPE?

Set the margins for the body element to 0. Example
<body leftmargin=0 topmargin=0 >
or <body style='margin: 0'>

These settings work fine with all 3 doctypes and without doctype.

54. HOW TO expand node after page is loaded?

Use JavaScript function ob_t26 on client side

'a1_2' here is a node ID. It must be unique.

55. HOW TO change text 'Loading ...' ?

Try to edit JavaScript file

Find this line with code
var fct = function (){ob_t24(ob_tb2, url, callback)};

Before (above) this line add another line
ob_tb2.innerHTML = "Your text...";

You can also try another trick and set image instead of text.
Change CSS style for "Loading ..." message.
Scroll Customize page down to bottom to "Loading..." message
Try to set background image with your text.
/* for message "Loading ..." */
   td.ob_t7 {
        font:1px Tahoma;
        border:1px solid #666666; 
    background-image: url('../images/MyText.jpg');

56. HOW TO select nodes when clicking on icons?

Add function ob_t26 to icon attribute like this

oTree.Add("a0", "b2", "Hello", false, "folder.gif\" onclick=\"ob_t26('b2')", null )

oTree.Add("a0", "b2", "Hello", false, "folder.gif"" onclick=""ob_t26('b2')" )

Pay attention to double quotes.

57. HOW TO select node by right clicking on it?

Add nodes like this:
oTree.Add("parent_id", "node_id", "<span oncontextmenu="return false;"
onmousedown="ob_t26('node_id');return false;"></span>
true, null, null);

58. HOW TO insert/edit one treeview on all pages of our website?

There are numerous ways to achieve this.
The easiest one is to define user control. See example here.

59. HOW TO add hover effect on nodes?

See page How to customize.
Scroll down the page to section "Links".
Use CSS classes A.ob_a2 and A.ob_a2:hover

60. HOW TO cache images to speed up loading of the TreeView in IE?
Just set path to images using this page
Internet Explorer will take images from cache and page will load much faster.

Why? Images with src starting with forward slash
(like src="/path/image.gif") are not cached by IE.

61. HOW TO drag and drop if the Aligned Columns feature is used?
Assign a CSS class to the TABLE element which contains the columns inside the nodes.
<table class="someClass"...

Then open the ob_mdn_xxxx.js file in your favorite editor.
Locate the following piece of code: o_N=o_M[i];
Replace it with this code:

62. HOW TO localize alert messages to other language?
Open the ob_tree_xxxx.js, ob_mdn_xxxx.js and ob_events_xxxx.js files
in your favorite editor (these files are located in the tree2/script folder).

Search for the following text: alert(
Translate the text inside the alert function to your language.

63. HOW TO use the TreeView in a Medium Trust Level environment?
The latest version of the TreeView works fine in a Medium Trust Level environment.
If you are using an older version of the tree please upgrade to the latest version.

Use the following links to download the latest version.

Full Version (if you purchased a license):

Old version:

64. How can I disable the message "Selected node does not exist"
when I reference a node that doesn't exist?

This message appears when using the SelectedId property or the 
ob_t26 client-side function to select a node which doesn't exist.

Follow these steps to disable this message:
- open the ob_tree_xxxx.js file (located in the tree2/script folder) in your favorite editor
- replace all the occurrences of the following piece of code:
alert("Selected node does not exists.");
/*alert("Selected node does not exists.");*/ 

65. HOW TO debug the page which loads the dynamic subtree?
Set oTree.Subtree = false for the dynamic subtree.
Then open the page which loads the subtree in a browser.
The subtree will be rendered as a regular treeview.
Now you can check if the subtree is created correctly and fix any possible bugs in your code. Once everything is ok, set oTree.Subtree = true

66. HOW TO use different files for handling server-side events,
without duplicating the tree2/script folder?

Edit the ob_events_xxxx.js file in your favorite editor and modify all
the calls to the method. Instead of hard-code the name of
the file, you can use a JS variable.
So, for example, instead of these:"TreeEvents.aspx", "OnNodeDrop");"TreeEvents.aspx", "OnAddNode");

you can use:, "OnNodeDrop");, "OnAddNode");

Then, in the head section of each page which uses the tree you can
set the "ob_server_file_name" variable to any page you want to handle
the server-side events:
<script type="text/javascript">
ob_server_file_name = "some_file.aspx";

67. HOW TO keep the state of same tree on different pages?
Go to ob_tree_xxxx.js( located in the "tree2/script" folder) and replace:

ob_page_location = 
    window.location.pathname.toString().substr(window.location.pathname.toString().lastIndexOf("/")  + 1)



Feel free to edit the file with your favorite editor.

68. HOW TO select the newly created nodes on client-side?
You need to add this code in the ob_OnAddNode event (located in the
tree2/script/ob_events_xxxx.js file): 

function ob_OnAddNode(...)

Feel free to edit the file with your favorite editor.

69. HOW TO make mouseover (hover) effect for nodes?
You need to use a custom javascript to loop through the tree
and attach the mouseover (hover) effect to each node.
Download the custom javascript.

70. HOW TO disable this pop-up message:
"Can't edit. The node is marked as not editable."?

In order to remove this alert message, please open the 
ob_mdn_xxxx.js file (located in the tree2/script folder) 
in your favorite editor and locate this piece of code:

alert("Can't edit. The node is marked as not editable.");
You can remove it or comment it:
/*alert("Can't edit. The node is marked as not editable.");*/

71. HOW TO programatically put a node in edit mode?

You need to apply the following code snippet:
var node = document.getElementById(nodeId);
 // if the node exists
 if (node != null) {
  currentlySelected = node;
  //mark as starting edit
  ob_tree_editnode_enable = true;
  //enter edit mode

72. HOW TO edit a node which contains HTML element?

You need to apply the following code snippet at the end of your aspx file:
    ob_editLastElement = false;

For any questions send us a support request. Home
TreeView Home
TreeView Home
Site Map
Dynamic Loading
No Icons
Black No Icons
Background image
Premiere New
TMenu (small icons)
Vista New
Right To Left
Drag and drop - 18
Dragging with children
Drop in textboxes
External D'n'D
Move nodes 1
Renumber nodes
Auto Scrolling
Copy / Move nodes
D'n'd and Dynamic Loading
Drop in listboxes
Drop in listboxes 2
Restrict Levels
D'n'D with various options
Disable dropping in two trees
Not-allowed Icon New
Sort after D'n'D New
Dynamic loading - 6
Web style
MSDN style
Deep tree
Reload subtrees
Loading trees partially
Virtual Scrolling New
Add/remove nodes - 4
Add/remove on client-side
Alphabetical order
Add to dynamic subtrees
Remove all children
Edit nodes - 4
Edit nodes
Nodes with Checkboxes
Sort after Edit New
Select nodes - 3
Find selected node
Select multiple nodes
Highlight parent
Layout - 2
Width, height and scrollbars
Root node
TreeView state - 3
Keep expanded
Keep collapsed
File system - 3
Show file system
File system loading
File system manager
Additional data for each node - 3
On client side
Image viewer
Expand/collapse nodes - 2
By level
Single folder
Multiple trees - 4
Two Trees
Two Trees custom
Two Trees enhancement
Move Nodes BTWN Trees New
Different Styles New
Validation - 2
D-n-d on server
Edit on server
Integration - 14
With a context menu
Attach Easy Menu
Attach menu on-demand
Attach to dynamic nodes
Attach menu to icons
Change icons
With Flyout
With Splitter
With checkboxes
Dynamic checkboxes
With a Combobox
With modal dialog
Outlook Slide Menu
With Tab Strip
Build from SiteMap
Customization - 7
Icons for treeview
Aligned columns
CSS Tutorial
Hover node effect
Multi-Level Slide Menu
Select on Collapse
From Dennis
From/To XML file
Keyboard navigation
Search nodes
Client-side events
Knowledge Base - 1
Knowledge Base
Method Add
Client-Side Events
XML Tutorial
Client-Side Tutorial
Tutorial 1
Tutorial 2
Tutorial 3
Tutorial 4
Event handlers
Using the correct path
Improving performance
In a user control
AutoPostBack with various options
Open in Search pane
Move nodes by clicking a button
Postback on node select
Switch icons