Client-side treeview handling

[Oren]

Hi,
My previous post was accidently sent in the middle of writing it.
So again, I use a treeview control in an aspx page. this control holds files
and folders. I handle its events with client-side javascript for performance
reasons.
I use the following function to handle the onselectedindexchange event of
the treeview:

function MainTreeIndexChanged()
{
var OldIndex = window.event.oldTreeNodeIndex;
var NewIndex = window.event.newTreeNodeIndex;
var TreeNode = event.srcElement.getTreeNode(newIndex);
var id = TreeNode.getAttribute("ID");
alert(id);
}

That way I'm able to get the selected node id.

The problem starts when I need to pass the selected index to the server
side. For example when the user clicks a "file" in the treeview, I need to
pass the selected index value to the server and fetch a matching XML from
the DB. Another example is when a file is selected and I press a "DEL"
button I need to pass the selected index value to the server along with a
deletion command.
I use a single page in that application so no frames are available to me.
I can't use the treeview control in the "autopostback=true" state because of
the project definitions.

What kind of approach or method can I use to overcome that problem?

 

[yasinonline]

Oren, how did you manage to get the treeview to respond to client side
functions?

I have used your function and placed it in the aspx page

I have set the onselectedindexchanged="javacript:
MainTreeIndexChanged()" and set the autopostback to false.

When I click on a treenode nothing happens.

I too would like to do something very similar to you, and would be
interested to know if you have got any further.

 

[Oren]

Hi,
Well, I have two kinds of trees in my application. one is a dynamically
generated treeview control (from the code behind file) and a static
treeview.
I catch the onSelectedIndexChange on the dynamically created treeview on
client side.
The actions I take are as followes:
1. I create the tree in a function:
dim newTree as new microsoft.web.ui.webcontrols.treeview
2. I define types for the treeview:
dim type as microsoft.web.ui.webcontrols.treenodetype
type = new microsoft.web.ui.webcontrols.treenodetype
type.Type = "Subject"
type.ImageURL = "images/subject.gif"
type.ChildType = "Item"
newTreeview.TreeNodesTypes.Add(type)
3. I do the same for another type called "Item"
4. I fill the tree recursively from an XML source
5. I add the event handler to the new tree
newTree.Attributes.add("onselectedindexchange",TreeIndexChanged();")
6. Now I add the TreeIndexChanged() function to the javascript section in
the ASPX page
The format is like I wrote in my initial message. but first you can just
check it with:
function TreeIndexChanged(){ alert("Changed");}
I think it should be even easier with the static treeview. try to play with
the 'runat="server" property and see if it makes any difference.
The AutoPostBack property should also be set to 'false'.
Good luck.
======================================