tree context menu in sliding pane

[Mohammad]

dear telerik,
i have a situation like following:

  <telerik:RadSplitter EnableAjaxSkinRendering="true" Skin="Office2007"  ID="uxSplitter" runat="server" Width="100%" Height="100%" >
          <telerik:RadPane ID="uxLeftArea" runat="server" Width="22px" Scrolling="none" Height="100%">
               <telerik:RadSlidingZone ClickToOpen="true" ID="uxLeftSlidingZone" runat="server" Width="22px" Height="100px">
                    <telerik:RadSlidingPane    ID="uxOCPane" Title="Organization Chart" runat="server" Width="200px" MinWidth="200">
                        <telerik:RadTreeView Skin="Office2007"  ID="uxOrganizationUnitTree" EnableDragAndDrop="True" MultipleSelect="false"  TabIndex="1" runat="server">
                            <ContextMenus>
                             <telerik:RadTreeViewContextMenu ID="uxOrganizationUnitCtxtMnu" runat="server">
                                <Items>
                                        <telerik:RadMenuItem Value="AddChild" Text="Add Child Unit ...">
                                        </telerik:RadMenuItem>
                                        <telerik:RadMenuItem Value="Delete" Text="Delete Unit ...">
                                        </telerik:RadMenuItem>
                                </Items>
                            </telerik:RadTreeViewContextMenu>
                            </ContextMenus>
                        </telerik:RadTreeView>
                        </telerik:RadSlidingPane>
                   </telerik:RadSlidingZone>
              </telerik:RadPane>
</telerik:RadSplitter>

i have a tree with context menu placed in a context pane, when i right click on the tree the context menu appears like the attached image.

[Shinu]

Hi Mohammad,

Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code which works fine at my end.

ASPX:

<telerik:RadSplitter EnableAjaxSkinRendering="true" Skin="Office2007" ID="uxSplitter"
    runat="server" Width="100%" Height="100%">
    <telerik:RadPane ID="uxLeftArea" runat="server" Width="22px" Scrolling="none" Height="100%">
        <telerik:RadSlidingZone ClickToOpen="true" ID="uxLeftSlidingZone" runat="server"
            Width="22px" Height="100px">
            <telerik:RadSlidingPane ID="uxOCPane" Title="Organization Chart" runat="server" Width="200px"
                MinWidth="200">
                <telerik:RadTreeView Skin="Office2007" ID="uxOrganizationUnitTree" EnableDragAndDrop="True"
                    MultipleSelect="false" TabIndex="1" runat="server">
                    <ContextMenus>
                        <telerik:RadTreeViewContextMenu ID="uxOrganizationUnitCtxtMnu" runat="server">
                            <Items>
                                <telerik:RadMenuItem Value="AddChild" Text="Add Child Unit ...">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Value="Delete" Text="Delete Unit ...">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Value="AddChild" Text="Add Child Unit ...">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Value="Delete" Text="Delete Unit ...">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Value="AddChild" Text="Add Child Unit ...">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Value="Delete" Text="Delete Unit ...">
                                </telerik:RadMenuItem>
                            </Items>
                        </telerik:RadTreeViewContextMenu>
                    </ContextMenus>
                    <Nodes>
                        <telerik:RadTreeNode runat="server" Text="one" ContextMenuID="uxOrganizationUnitCtxtMnu">
                            <Nodes>
                                <telerik:RadTreeNode runat="server" Text="one1.1" ContextMenuID="uxOrganizationUnitCtxtMnu">
                                </telerik:RadTreeNode>
                                <telerik:RadTreeNode runat="server" Text="one1.2" ContextMenuID="uxOrganizationUnitCtxtMnu">
                                </telerik:RadTreeNode>
                            </Nodes>
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Two" ContextMenuID="uxOrganizationUnitCtxtMnu">
                        </telerik:RadTreeNode>
                        <telerik:RadTreeNode runat="server" Text="Three" ContextMenuID="uxOrganizationUnitCtxtMnu">
                        </telerik:RadTreeNode>
                    </Nodes>
                </telerik:RadTreeView>
            </telerik:RadSlidingPane>
        </telerik:RadSlidingZone>
    </telerik:RadPane>
</telerik:RadSplitter>

Please provide your full code if it doesn't help.
Thanks,
Shinu.

[Mohammad]

sorry i forgot to mention that my page has direction (rtl) kindly try in this case the context menu appears incomplete in this state,
try on your example to make the body direction (rtl) this will simulate my case,
thank you for your help and interest

[Boyan Dimitrov]

Hello,

Please find a sample project that implements right to left direction for the RadSplitter, RadTreeView and the context menu. Please note that this is our recommended way of achieving such scenario so you can use that approach in your project.


Regards,
Boyan Dimitrov
Telerik