Client side Javascript programming.

Question

0.00/5 (No votes)

See more:

Hi all,
I have a page where it has "tree view control" . The data in the page will be like the following

<asp:TreeView ID="MyTreeView" Runat="server">
  <nodes>
    <asp:TreeNode Value="Child1" Expanded="False" Text="Par1">
      <asp:TreeNode Value="Grandchild1" Text="Chil1" />
      <asp:TreeNode Value="Grandchild2" Text="Chil2" />
      <asp:TreeNode Value="Grandchild3" Text="Chil3" />
    
    <asp:TreeNode Value="Child2" Expanded="False" Text="Par2">
      <asp:TreeNode Value="Grandchild1" Text="son4" />
      <asp:TreeNode Value="Grandchild2" Text="sonl5" />
      <asp:TreeNode Value="Grandchild3" Text="sonl6" />
    
    <asp:TreeNode Value="Child3" Expanded="False" Text="Par3">
      <asp:TreeNode Value="Grandchild1" Text="father7" />
      <asp:TreeNode Value="Grandchild2" Text="father8" />
      <asp:TreeNode Value="Grandchild3" Text="father9" />
    
  </nodes>

My task is i have to add one "Flter text box" in the page, where as the user enters text into this text box, it would "filter" the individual child in the "tree view control" that matches what is being typed.
Please see below for an example:
For example if user typed the word "chi". The idea is that as user type the letters, i would automatically do the following:
(1) Open up any parent nodes where they have a child that matches what is being typed.
(2) Hide any children that do not match what is being typed.
If the user deletes what's in the text box, it would naturally show all things and "close" all the parent nodes. I want to do this filtering with some client side javascript.
Please help me, thank you in advance please let me know if the question is not clear. I will explain clearly one more time.

Posted 14-Jun-11 10:26am

Kumarus2244

Updated 14-Jun-11 12:18pm

Dave Kreskowiak

v2

Add a Solution

Comments

[no name] 14-Jun-11 16:31pm

And what have you tried? What problems are you encountering?

Kumarus2244 14-Jun-11 16:35pm

I am sorry mark, i am completely new to Java script, i never done any thing could you give me some hints at least how to start.... or give me some links where i can find some related issues...

Kumarus2244 14-Jun-11 17:12pm

Hi mark,

I started like the following, the following functions are to select treeview and as well as to select specific node in treeview,
<pre> // Gets a handle to the TreeView.

//

function GetTreeHandle()
{
var tree;
var treeName = 'tvControl';

// Get a handle to the TreeView.

tree = document.getElementById( treeName );

if ( null == tree || undefined == tree )
return null;

return tree;
}
// Gets a handle to the TreeView's selected node.

//

function GetSelectedNode()
{
var tree = GetTreeHandle();
var treeNode;

if ( null == tree || undefined == tree )
return null;

treeNode = tree.getTreeNode( tree.selectedNodeIndex );

if ( null == treeNode || undefined == treeNode )
return null;

return treeNode;
}
</pre>

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Christian Graus · Answer 1 · 2011-06-14T13:49:00

Why have you been given this task if you have no idea about Javascript ? You should talk to the person who gave you this task and explain to them that if your company is to be paid for work they do, they need to hire people with some idea of how to do the work, and not rely on random strangers to do it for them. If you're doing web development, then you should buy a good Javascript book and work through it. After doing that, if you're stuck on specifics, you should ask specific questions here that start with 'here is the code I've tried', instead of just asking us to do your job for you.

RakeshMeena · Answer 2 · 2011-06-14T18:22:00

Solution 2

I suggest you try a JQuery TreeView plugin. This link will help you.

Posted 14-Jun-11 18:22pm

RakeshMeena