I have a TreeView control that renders correctly on my page (style gets applied). However, if I add a context menu to the page my style does not get loaded for the TreeView (it renders as bullet points).
Note: My context menu is for a different control on the page, not for the treeview.
I am assuming this has something to do with both controls using the <ul> element, how can I have both controls on the same page without this rendering issue?
Note: My context menu is for a different control on the page, not for the treeview.
I am assuming this has something to do with both controls using the <ul> element, how can I have both controls on the same page without this rendering issue?
<telerik:RadContextMenu ID="cm1" runat="server" > <Items> <telerik:RadMenuItem Value="EDIT" ImageUrl="~/images/edit.gif"></telerik:RadMenuItem> <telerik:RadMenuItem Value="DELETE" ImageUrl="~/images/delete.gif"></telerik:RadMenuItem> </Items> <Targets> <telerik:ContextMenuControlTarget ControlID="lbtnAddNewRule" /> </Targets> </telerik:RadContextMenu> <asp:LinkButton ID="lbtnAddNewRule" runat="server"></asp:LinkButton> <telerik:RadTreeView runat="server" ID="tvSelectedUsersA" Width="200px" Height="200px" Skin="Default"> </telerik:RadTreeView>2 Answers, 1 is accepted
0
Shinu
Top achievements
Rank 2
Rank 2
answered on 06 Jul 2011, 10:35 AM
Hello Laine,
I cannot reproduce the issue at my end. Here is the sample code which worked as expected at my end.
aspx:
Thanks,
Shinu.
I cannot reproduce the issue at my end. Here is the sample code which worked as expected at my end.
aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FromXML.aspx.cs" Inherits="TreeView_FromXML" %><%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <telerik:RadContextMenu ID="cm1" runat="server"> <Items> <telerik:RadMenuItem Value="EDIT" ImageUrl="../Images/tabSelected.jpg"> </telerik:RadMenuItem> <telerik:RadMenuItem Value="DELETE" ImageUrl="../Images/Refresh.gif"> </telerik:RadMenuItem> </Items> <Targets> <telerik:ContextMenuControlTarget ControlID="lbtnAddNewRule" /> </Targets> </telerik:RadContextMenu> <asp:LinkButton ID="lbtnAddNewRule" runat="server">Hai</asp:LinkButton> <br /> <br /> <br /> <telerik:RadTreeView ID="RadTreeView1" runat="server" Skin="WebBlue" DataFieldID="CustomerID" DataTextField="CompanyName" DataSourceID="XmlDataSource1" OnNodeDataBound="RadTreeView1_NodeDataBound"> </telerik:RadTreeView> <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~\RadTextBox\XMLFile.xml" XPath="/Customers/Customer"></asp:XmlDataSource> </div> </form></body></html>Thanks,
Shinu.
0
Laine
Top achievements
Rank 1
Rank 1
answered on 07 Jul 2011, 05:44 PM
Hi Shinu,
After further inverstigation my issue is actually being caused by having a DateTimePicker control and a TreeView control on the same User Control (both loaded by an Ajax Request). Below is the code for my User Control:
My user control is being called from another page and is wrapped in a tooltip:
See image1.png for resulting rendering of the controls (treeview has not rendered correctly)
If I change the order of thecontrols in my user control (put the treeview first and datetime picker afterwards) I get different UI rendering where my treeview renders correctly but I lose all skin rendering for my datetime picker (including buttons, popup calendar etc.) example code:
See image2.png for resulting rendering of the controls (treeview has rendered correctly, datetimepicker has lost buttons and skin)
After further inverstigation my issue is actually being caused by having a DateTimePicker control and a TreeView control on the same User Control (both loaded by an Ajax Request). Below is the code for my User Control:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <table> <tr> <td> <telerik:RadDateTimePicker ID="dtpStartDate" AutoPostBack="true" runat="server" Width="200px" DateInput-Enabled="False"> </telerik:RadDateTimePicker > </td> </tr> <tr> <td> <telerik:RadTreeView runat="server" ID="tvSelectedUsersA" Width="200px" Height="200px" SelectionMode="Multiple" BorderColor="#666666" BorderStyle="Solid" BorderWidth="1" > </telerik:RadTreeView> </td> </tr> </table>
</ContentTemplate>
</asp:UpdatePanel>
My user control is being called from another page and is wrapped in a tooltip:
<telerik:RadToolTip ID="ttNotesDetails" runat="server" Position="Center" Width="510" RelativeTo="BrowserWindow" ShowEvent="FromCode" HideDelay="300" ShowDelay="300" AutoCloseDelay="0" TargetControlID="ddlTextBox" HideEvent="FromCode" Animation="None" Modal="true" style="z-index:1000;" > <myControl:MyUserControl ID="MyUserControl" runat="server"" /> </telerik:RadToolTip>
See image1.png for resulting rendering of the controls (treeview has not rendered correctly)
If I change the order of thecontrols in my user control (put the treeview first and datetime picker afterwards) I get different UI rendering where my treeview renders correctly but I lose all skin rendering for my datetime picker (including buttons, popup calendar etc.) example code:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <table> <tr> <td> <telerik:RadTreeView runat="server" ID="tvSelectedUsersA" Width="200px" Height="200px" SelectionMode="Multiple" BorderColor="#666666" BorderStyle="Solid" BorderWidth="1" > </telerik:RadTreeView> </td> </tr> <tr> <td> <telerik:RadDateTimePicker ID="dtpStartDate" AutoPostBack="true" runat="server" Width="200px" DateInput-Enabled="False"> </telerik:RadDateTimePicker > </td> </tr> </table> </ContentTemplate> </asp:UpdatePanel>