
Andrew Denham
Top achievements
Rank 1
Andrew Denham
asked on 14 Sep 2010, 05:07 PM
Hi,
I have a radTreeView control set-up as:
I add the nodes from the code behind and it goes down about 3 levels. What I want to acheive is when a user clicks on the text of a node it will expand and show the children.
Can this be done easily by setting a value on either the control or on each node when added?
Many thanks
Ed
I have a radTreeView control set-up as:
<
telerik:RadTreeView
ID
=
"tvIndustrySectors"
runat
=
"server"
CheckBoxes
=
"true"
TriStateCheckBoxes
=
"False"
Height
=
"180px"
/>
I add the nodes from the code behind and it goes down about 3 levels. What I want to acheive is when a user clicks on the text of a node it will expand and show the children.
Can this be done easily by setting a value on either the control or on each node when added?
Many thanks
Ed
6 Answers, 1 is accepted
0
Hi Ed Jones,
This could be achieved easily via javascript by subscribing to the OnClientNodeClicked event.
Please take a look at this help topic how.
Regards,
Veronica Milcheva
the Telerik team
This could be achieved easily via javascript by subscribing to the OnClientNodeClicked event.
Please take a look at this help topic how.
Regards,
Veronica Milcheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0

Andrew Denham
Top achievements
Rank 1
answered on 15 Sep 2010, 12:17 PM
Many thanks for this, it works just as I wanted, now I have one more follow up request.
As originally explained I have a tree which is two-three levels deep, when clicking a text lable on the level1 or level2 nodes I want the action to expand which is what it now does, however, on the end nodes (leaf?) I have checkboxes displayed, I'd like the text label on these to automatically check thebox when the text is clicked. I'm sure this is possible in a similar way to the above but need guidence as to what to set and run.
Many thanks
Ed
As originally explained I have a tree which is two-three levels deep, when clicking a text lable on the level1 or level2 nodes I want the action to expand which is what it now does, however, on the end nodes (leaf?) I have checkboxes displayed, I'd like the text label on these to automatically check thebox when the text is clicked. I'm sure this is possible in a similar way to the above but need guidence as to what to set and run.
Many thanks
Ed
0
Hello Ed Jones,
Yes, you can use the same client-side event to achieve this. You only need to get all of the nodes of the currently selected node and check which one of them have no children (leaf nodes) and to check them. Here's the code:
Hope this helps.
Kind regards,
Veronica Milcheva
the Telerik team
Yes, you can use the same client-side event to achieve this. You only need to get all of the nodes of the currently selected node and check which one of them have no children (leaf nodes) and to check them. Here's the code:
function
ClientNodeClicked(sender, eventArgs) {
var
node = eventArgs.get_node();
node.toggle();
var
allNodes = node.get_allNodes();
if
(node.get_checked()) {
for
(
var
i = 0; i < allNodes.length; i++) {
if
(allNodes[i].get_nodes().get_count() == 0) {
allNodes[i].set_checked(
false
);
}
}
}
else
{
for
(
var
i = 0; i < allNodes.length; i++) {
if
(allNodes[i].get_nodes().get_count() == 0) {
allNodes[i].set_checked(
true
);
}
}
}
}
function
clientNodeChecking(sender, args) {
args.set_cancel(
true
);
}
Hope this helps.
Kind regards,
Veronica Milcheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0

Andrew Denham
Top achievements
Rank 1
answered on 16 Sep 2010, 04:30 PM
Thanks but not quite what I needed. I don't need to check all the children, I need to tick the currently selected box AND then fire this as an AJAX post back so that it fires the same event as:
Protected
Sub
tvIndustrySectors_SelectionChanged(
ByVal
sender
As
Object
,
ByVal
e
As
Telerik.Web.UI.RadTreeNodeEventArgs)
Handles
tvIndustrySectors.NodeCheck
Using your code I can check the current item by using:
<script language=
"javascript"
type=
"text/javascript"
>
function
ClientNodeClicked(sender, eventArgs) {
var
node = eventArgs.get_node();
node.toggle();
node.set_checked(
true
);
if
(node.get_checked() ==
true
) {
//
}
}
</script>
I just need to now signify which node was checked to the code behind.
Thanks
Ed
0
Hello Ed Jones,
Here's the code for AJAX postback:
Javascript:
C#:
Now in e.Argument you have the "ticked" node and you can process with it as you like futher. Find the full code in the attached .zip file.
Hope this helps.
Kind regards,
Veronica Milcheva
the Telerik team
Here's the code for AJAX postback:
Javascript:
function
ClientNodeClicked(sender, eventArgs) {
var
node = eventArgs.get_node();
node.toggle();
node.set_checked(
true
);
if
(node.get_checked() ==
true
) {
var
ajaxManager = $find(
"<%= RadAjaxManager1.ClientID %>"
);
ajaxManager.ajaxRequest(
"checked"
);
}
}
C#:
protected
void
RadAjaxManager1_AjaxRequest(
object
sender, Telerik.Web.UI.AjaxRequestEventArgs e)
{
RadAjaxManager1.Alert(e.Argument);
}
Now in e.Argument you have the "ticked" node and you can process with it as you like futher. Find the full code in the attached .zip file.
Hope this helps.
Kind regards,
Veronica Milcheva
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0

Andrew Denham
Top achievements
Rank 1
answered on 21 Sep 2010, 03:24 PM
Thanks I've got this working by adding the radAJAXManager and using this Javascript:
function
ClientNodeClicked(sender, eventArgs) {
var
node = eventArgs.get_node();
node.toggle();
if
(node.get_checked() ==
true
)
{
node.uncheck();
}
else
{
node.check();
}
var
ajaxManager = $find(
"<%= RadAjaxManager1.ClientID %>"
);
if
(node.get_checked() ==
true
)
{
ajaxManager.ajaxRequest(node.get_value);
}
else
{
node.set_checked(
false
);
ajaxManager.ajaxRequest(node.get_value);
}
}