RadTreeView and Keyboard Support

[A]

Hello,

We need to implement keyboard navigation for RadTreeView.  I understand that RadTreeView includes full keyboard navigation support. I looked at this example:

http://www.telerik.com/help/aspnet/treeview/tree_keyboard%20support.html

 

which is a good start but this is what we need:

 

Hot key support should work with <Alt> <Ctrl> <Letter>

e.g., <alt><ctr> A

When a user presses the above key combination, 

1. navigate the user to a particular child node in a tree (it might be several level deep in the tree) – select node

2. Expand the parent nodes so the selected node is visible to user

3. Simulate a node click event, so that data in other controls on the page might be changed in the callback

 

We are using ASP.Net Ajax and vb.net

The RadTreeView is populated server-side.

 

Please let me know if the above is possible and a working example will be great.

 

Thanks,

[Plamen]

Hi A,

Here is a javascript code that should work for you:

function OnClientKeyPressing(sender, args) {
           var tree = $find("<%= RadTreeView1.ClientID %>");
           if (window.event.ctrlKey && window.event.altKey && window.event.keyCode==65) {
               var node = tree.findNodeByText("Text of Some node!");
               node.get_parent().expand();
               node.select();
           }

Calling the select() function will select the Node and do postback.

You may also have a look at the help article.

Hope this will help you.

All the best,
Plamen Zdravkov
the Telerik team

[A]

Thank you for your reply, but since the requirement was to use the key combination on the page (not necessarily while the focus is on the tree) your suggestion does not work for us. Also, we are populating the tree server side so cannot use findNodeByText.

The solution that is now working for us is:

1. document.onkeydown in ascx
2. function in ascx to check for the specific key combination and then call __doPostBack.

The only thing not working is the node does not appear selected (when I click on a node, it appears highlighted and selected).

In ascx.vb I am doing this but it is not working:
        node.ExpandParentNodes()
         node.Selected = True
        node.Focus()

 Any ideas?

Anita

[Plamen]

Hi A,

The code that you posted works fine at my side. If you want to have the chance to continue right away with some other keyboard commands you will have to focus the treeview as well:

node.ExpandParentNodes()
node.Selected = True
node.Focus()
RadTreeView1.Focus()

If you have further questions, please let me know.


Best wishes,
Plamen Zdravkov
the Telerik team