Andy Green
Top achievements
Rank 1
Andy Green
asked on 12 Oct 2009, 06:47 AM
Hi
I'm using the tree view to display names and on clickin the name I'm able to load that persons data into a form. The top level node is the group the person belongs to. This is all driven from code behind with the data coming from a class.
This is my load code to populate the tree.
What I'd like to do now is add an image to the person name - this is the secon level node, and have that fire a separate event, so not to load the paersons details into a form, but rather load their data into a report.
How can I add this image just to the persons name node and fire 2 separate routines.
Andy
I'm using the tree view to display names and on clickin the name I'm able to load that persons data into a form. The top level node is the group the person belongs to. This is all driven from code behind with the data coming from a class.
This is my load code to populate the tree.
.DataValueField = 1
.DataSource = dt
.DataFieldID =
"ID"
.DataFieldParentID = "ParentID"
.DataTextField = "Node"
.DataValueField = "ChildID"
.DataBind()
What I'd like to do now is add an image to the person name - this is the secon level node, and have that fire a separate event, so not to load the paersons details into a form, but rather load their data into a report.
How can I add this image just to the persons name node and fire 2 separate routines.
Andy
10 Answers, 1 is accepted
0
Hello Andy,
I'm not sure I understand this requirement. You can use NodeDataBound event to map additional columns from the datasource as it's explained here.
Regards,
Yana
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
I'm not sure I understand this requirement. You can use NodeDataBound event to map additional columns from the datasource as it's explained here.
Regards,
Yana
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 13 Oct 2009, 07:03 AM
What I have is the persons name that I click on to get the data for that person, what I want to do is have an image nest to the persons name, that when clicked, rund a report.
I need to add the image, and then handle the on click in a different way to the text onclick.
Andy
I need to add the image, and then handle the on click in a different way to the text onclick.
Andy
0
Hi Andy Green,
To have an image next to the node you need to set the ImageUrl property of the node. This could be done in the NodeDataBound event as stated above.
Then you can use the following javascript code (just copy it to your aspx page) to subscribe to the click event of the image:
Hope this helps
Regards,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
To have an image next to the node you need to set the ImageUrl property of the node. This could be done in the NodeDataBound event as stated above.
Then you can use the following javascript code (just copy it to your aspx page) to subscribe to the click event of the image:
<script type=
"text/javascript"
>
window.$ = $telerik.$;
$(document).ready(
function
() {
$(
".rtImg"
).click(imageClick); });
function
imageClick()
{
// image click handler
}
</script>
Hope this helps
Regards,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 15 Oct 2009, 01:16 PM
Thanks
Nearly there, this puts an image on every node, I want them just against the names on the second level, how would I achieve this.
Also when I click in the image, it runs the node click event, not the javascript.
Bad week so far what with this and the reporting issues I have, not as easy to do as it first appears.
Andy
Nearly there, this puts an image on every node, I want them just against the names on the second level, how would I achieve this.
Also when I click in the image, it runs the node click event, not the javascript.
Bad week so far what with this and the reporting issues I have, not as easy to do as it first appears.
Andy
0
Hi Andy Green,
Here is a sample:
Hope this helps.
Greetings,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Here is a sample:
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
DataFieldID
=
"idResource"
DataFieldParentID
=
"idResourceParent"
DataSourceID
=
"SqlDataSource1"
DataTextField
=
"name"
DataValueField
=
"idResource"
onnodeclick
=
"RadTreeView1_NodeClick"
onnodedatabound
=
"RadTreeView1_NodeDataBound"
>
</
telerik:RadTreeView
>
<script type=
"text/javascript"
>
window.$ = $telerik.$;
$(document).ready(
function
() {
$(
".rtImg"
).click(imageClick);
});
function
imageClick() {
// image click handler
alert(
"click image"
);
return
false
;
}
</script>
protected
void
RadTreeView1_NodeDataBound(
object
sender, RadTreeNodeEventArgs e)
{
if
(e.Node.Level == 1)
{
e.Node.ImageUrl =
"Telerik.ico"
;
}
}
Hope this helps.
Greetings,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 16 Oct 2009, 02:23 PM
Thanks
This worked OK, I think my mistake was putting the javascript in with the main javascript inclued. If I place it in one of the content areas it's ok. (Sorry forgot to say I'm using masterpages)
This fires the JS OK, but I need the ID of the node at the server, is there any more help you can offer.
In the meantime does the control diferentiate between what part of the node is clicked, before posting back.
Could I do this easier with a node template?
Andy
This worked OK, I think my mistake was putting the javascript in with the main javascript inclued. If I place it in one of the content areas it's ok. (Sorry forgot to say I'm using masterpages)
This fires the JS OK, but I need the ID of the node at the server, is there any more help you can offer.
In the meantime does the control diferentiate between what part of the node is clicked, before posting back.
Could I do this easier with a node template?
Andy
0
Hi Andy Green,
The postback will happen no matter where you click in the node.
You can store the ID to the Value property of the node (by using the DataValueField property) and then use node.Value to get the ID.
Hope this helps.
Kind regards,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
The postback will happen no matter where you click in the node.
You can store the ID to the Value property of the node (by using the DataValueField property) and then use node.Value to get the ID.
Hope this helps.
Kind regards,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 19 Oct 2009, 12:28 PM
Thanks Veselin
I'm using the e.node.value already on the server, and this is giving me what I want when the user clicks the node, what I want to do is run some other server side code when the user clicks the image, the exampe you have given me fires a client side event for the image click.
How do I get this (with the node id) back to the server so I can have 2 different events from the same node? (text click and image click)
These controls are new to use here, we have 3 licences but I'm the only one trying to use them, perhaps when other developers pick them up we can help each other, but for now you guys are all I have.
I'm begining to think I cant do alot of what I want and for some reason all my gremlins have come at once, with this and my reporting problems. I've painted myself into a corner, thinking the controls would do what I wanted easily, but inspite of great forum help and the docs and videos, the help does seem some what disjointed.
ANdy
I'm using the e.node.value already on the server, and this is giving me what I want when the user clicks the node, what I want to do is run some other server side code when the user clicks the image, the exampe you have given me fires a client side event for the image click.
How do I get this (with the node id) back to the server so I can have 2 different events from the same node? (text click and image click)
These controls are new to use here, we have 3 licences but I'm the only one trying to use them, perhaps when other developers pick them up we can help each other, but for now you guys are all I have.
I'm begining to think I cant do alot of what I want and for some reason all my gremlins have come at once, with this and my reporting problems. I've painted myself into a corner, thinking the controls would do what I wanted easily, but inspite of great forum help and the docs and videos, the help does seem some what disjointed.
ANdy
0
Accepted
Hi Andy Green,
Here is what you can do - add a hidden field which will hold whether the image or the node text was clicked.
Here is the complete code:
Then in the server NodeClick event you can check the value of the hidden field and perform different actions:
Hope this helps.
Greetings,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Here is what you can do - add a hidden field which will hold whether the image or the node text was clicked.
Here is the complete code:
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
DataFieldID
=
"idResource"
DataFieldParentID
=
"idResourceParent"
DataSourceID
=
"SqlDataSource1"
DataTextField
=
"name"
DataValueField
=
"idResource"
onnodeclick
=
"RadTreeView1_NodeClick"
onnodedatabound
=
"RadTreeView1_NodeDataBound"
>
</
telerik:RadTreeView
>
<
asp:HiddenField
ID
=
"hdnImageClicked"
runat
=
"server"
Value
=
"false"
/>
<script type=
"text/javascript"
>
window.$ = $telerik.$;
$(document).ready(
function
() {
$(
".rtImg"
).click(imageClick);
});
function
imageClick() {
// image click handler
$get(
"hdnImageClicked"
).value =
"true"
;
}
</script>
Then in the server NodeClick event you can check the value of the hidden field and perform different actions:
protected
void
RadTreeView1_NodeClick(
object
sender, RadTreeNodeEventArgs e)
{
if
(hdnImageClicked.Value ==
"true"
)
{
//image clicked
Response.Write(
"Image clicked"
);
hdnImageClicked.Value =
"false"
;
}
else
{
//node text clicked
Response.Write(
"Node text clicked"
);
}
}
Hope this helps.
Greetings,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Andy Green
Top achievements
Rank 1
answered on 21 Oct 2009, 01:15 PM
Fantastic - thank you.
I can see a lot of uses for this.
Andy
I can see a lot of uses for this.
Andy