Hello,
I need to create a RadTreeview with each tree node having a image and text.
If I click on text, it must navigate to a page. I can set this with node.NavigateUrl.
If I click on image , it must navigate to another page. How can I achieve this?
With node.ImageURL , I am able to set a image in node but can we set navigateURL for image or do I need to add another image at end of text and set its URL?
Can we guide me how to navigate to different pages while clicking on image and text of a node?
Thanks in advance.
Kavitha
I need to create a RadTreeview with each tree node having a image and text.
If I click on text, it must navigate to a page. I can set this with node.NavigateUrl.
If I click on image , it must navigate to another page. How can I achieve this?
With node.ImageURL , I am able to set a image in node but can we set navigateURL for image or do I need to add another image at end of text and set its URL?
Can we guide me how to navigate to different pages while clicking on image and text of a node?
Thanks in advance.
Kavitha
4 Answers, 1 is accepted
0
Accepted

Shinu
Top achievements
Rank 2
answered on 11 Apr 2014, 04:14 AM
Hi Kavitha,
As a suggestion you can try with NodeTemplate to achieve your scenario as follows.
ASPX:
JavaScript:
Let me know if you have any concern.
Thanks,
Shinu.
As a suggestion you can try with NodeTemplate to achieve your scenario as follows.
ASPX:
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
>
<
Nodes
>
<
telerik:RadTreeNode
>
<
NodeTemplate
>
<
asp:Image
ID
=
"Image1"
runat
=
"server"
ImageUrl
=
"~/Images/Black_Plus.png"
onclick
=
"ImageNavigate();"
/>
<
asp:Label
ID
=
"label1"
runat
=
"server"
Text
=
"Node1"
onclick
=
"TextNavigate();"
>
</
asp:Label
>
</
NodeTemplate
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeView
>
JavaScript:
function
ImageNavigate() {
window.open(
"http://www.w3schools.com"
,
"_blank"
);
}
function
TextNavigate() {
window.open(
"http://www.telerik.com"
,
"_blank"
);
}
Let me know if you have any concern.
Thanks,
Shinu.
0

Kavitha
Top achievements
Rank 1
answered on 16 Apr 2014, 04:14 PM
Thank you very much.
Your solution worked well.
Your solution worked well.
0

Kavitha
Top achievements
Rank 1
answered on 26 May 2014, 02:39 PM
Hello,
I have used template for RadTreeview.
I have an imagebutton and label in my template as mentioned above. Clicking on image goes to a url and clicking of label goes to another url.
Now I want the selected node to be in bold letters. I want to the letters in label to be in bold letters.
If I construct treeview without template, we can use OnNodeClick event and put
node.Selected = true to make the selected node in bold letters.
But with template, OnNodeClick event is not fired. How I can make the selected node in
bold letters with template?
Can you give me any idea?
Thanks in advance.
Kavitha
I have used template for RadTreeview.
I have an imagebutton and label in my template as mentioned above. Clicking on image goes to a url and clicking of label goes to another url.
Now I want the selected node to be in bold letters. I want to the letters in label to be in bold letters.
If I construct treeview without template, we can use OnNodeClick event and put
node.Selected = true to make the selected node in bold letters.
But with template, OnNodeClick event is not fired. How I can make the selected node in
bold letters with template?
Can you give me any idea?
Thanks in advance.
Kavitha
0

Shinu
Top achievements
Rank 2
answered on 27 May 2014, 06:01 AM
Hi Kavitha,
Please have a look into the sample code snippet to achieve your scenario.
ASPX:
C#:
Thanks,
Shinu.
Please have a look into the sample code snippet to achieve your scenario.
ASPX:
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
OnNodeClick
=
"RadTreeView1_NodeClick"
>
<
NodeTemplate
>
<
asp:Image
ID
=
"Image1"
runat
=
"server"
ImageUrl
=
"~/Images/Black_Plus.png"
onclick
=
"ImageNavigate(); return false;"
/>
<
asp:Label
ID
=
"label1"
runat
=
"server"
Text
=
"Node1"
onclick
=
"TextNavigate(this);"
>
</
asp:Label
>
</
NodeTemplate
>
<
Nodes
>
<
telerik:RadTreeNode
>
</
telerik:RadTreeNode
>
<
telerik:RadTreeNode
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeView
>
C#:
protected
void
RadTreeView1_NodeClick(
object
sender, Telerik.Web.UI.RadTreeNodeEventArgs e)
{
foreach
(RadTreeNode node
in
RadTreeView1.Nodes)
{
Label label = (Label)node.FindControl(
"label1"
);
if
(node.Selected)
{
label.Style.Add(
"font-Weight"
,
"bold"
);
}
else
{
label.Style.Add(
"font-Weight"
,
"normal"
);
}
}
}
Thanks,
Shinu.