Selected node in TreeView with javascript
-
I want to get the selected node from my treeview on client side by javascript. I have tried TreeView1.getTreeNode(...) but it seemes like getTreeNode doesn't exists. I have also tried TreeView1.selectedNodeIndex but that doesn't exists eather. If you know how to, please help me. Thanx
-
I want to get the selected node from my treeview on client side by javascript. I have tried TreeView1.getTreeNode(...) but it seemes like getTreeNode doesn't exists. I have also tried TreeView1.selectedNodeIndex but that doesn't exists eather. If you know how to, please help me. Thanx
Hi there, Assume you are talking about the Microsoft IE TreeView control, and to access the selected node at the client side you can do as below:
...
var treeView = document.getElementById("TreeView1");
var treeNode = treeView.getTreeNode(treeView.selectedNodeIndex);
...However, as you may already know that the treeview control uses a htc component treeview.htc, so the above script only works when you are using IE and when you view source the web page you will see something like:
<?XML:NAMESPACE PREFIX=TVNS />
<?IMPORT NAMESPACE=TVNS IMPLEMENTATION="/webctrl_client/1_0/treeview.htc" />
<tvns:treeview ...>
tvns:treenode
...
</tvns:treenode>
</tvns:treeview> -
Hi there, Assume you are talking about the Microsoft IE TreeView control, and to access the selected node at the client side you can do as below:
...
var treeView = document.getElementById("TreeView1");
var treeNode = treeView.getTreeNode(treeView.selectedNodeIndex);
...However, as you may already know that the treeview control uses a htc component treeview.htc, so the above script only works when you are using IE and when you view source the web page you will see something like:
<?XML:NAMESPACE PREFIX=TVNS />
<?IMPORT NAMESPACE=TVNS IMPLEMENTATION="/webctrl_client/1_0/treeview.htc" />
<tvns:treeview ...>
tvns:treenode
...
</tvns:treenode>
</tvns:treeview>Hi! Thanx for the answer. I have tried the above one but it doesn't work for me in IE. I looked for the script you wrote about that I should find when i choose "view source" but i can't even find the import tag. Why not? Is there maybe something I have to import my self or is it done automaticly? Is there a way to get the selected node in javascipt for FireFox? Thanx.
-
Hi! Thanx for the answer. I have tried the above one but it doesn't work for me in IE. I looked for the script you wrote about that I should find when i choose "view source" but i can't even find the import tag. Why not? Is there maybe something I have to import my self or is it done automaticly? Is there a way to get the selected node in javascipt for FireFox? Thanx.
-
Hi! Thanx for the answer. I have tried the above one but it doesn't work for me in IE. I looked for the script you wrote about that I should find when i choose "view source" but i can't even find the import tag. Why not? Is there maybe something I have to import my self or is it done automaticly? Is there a way to get the selected node in javascipt for FireFox? Thanx.
Larza123 wrote:
Is there maybe something I have to import my self or is it done automaticly? Is there a way to get the selected node in javascipt for FireFox?
It should be automatically included by the treeview control when it is rendered. In fact, the treeview is a kind of the browser-dependent controls, it means that at runtime depending on which browser that the client is using, the control will choose a way to render accordingly. In this case, for the uplevel browsers (the IE 5.5 and above), the
RenderUpLevelPath
method is used to render control, this method contain code to render the import script that you can see in my previous post. For downlevel browsers (non-Microsoft browsers like FireFox), theRenderDownLevelPath
method is used to render and the control at the client side is represented by a table. For more information on these methods, you can have a look at thetreeview
class in the source filetreeview.cs
. In an ASP.NET application, you can use the browserCap[^] element to detect the client browser and control the rendering of the control. However, you should remeber that the Microsoft uses an htc componenttreeview.htc
and this dhtml component is supposed to run in the IE only. If you want to access the selected node using javascript in FF, you'll have to think about another solution, for example the treeview control in FF is a table and the selected node should be a specific td element in the table. In addition to the Microsoft treeview control, there are also a couple of other third party controls posted in the ASP.NET control gallery[^]. -
Hi again! I forgot to tell you that I use ASP.NET 2.0 if that makes any differense in this case.
Oops! You didn't reply to my post and I have no idea about your post as well as the fact that you are using the treeview control in the ASP.NET 2.0. So first of all, you can forget all the sample code in my previous posts, then you might think about another solution since the SelectedNode is the server side property. In the ASP.NET 2.0. the treeview control is rendered as a table and also using the div element, you might consider using the client call back to request the curent selected node of the treeview control. For more information, you can see: http://msdn2.microsoft.com/en-us/library/3eafky27[^] http://msdn2.microsoft.com/en-us/library/system.web.ui.webcontrols.treeview.populatenodesfromclient[^] http://beta.asp.net/QUICKSTART/aspnet/doc/ctrlref/navigation/treeview.aspx[^]