docking to right

6 posts, 0 answers
  1. ehsan
    ehsan avatar
    27 posts
    Member since:
    Apr 2008

    Posted 29 Jul 2009 Link to this post

    <head runat="server"
        <title></title
        <style> 
    html,body { 
        margin:0; 
        padding:0; 
        height:100%; /* needed for container min-height */ 
        </style> 
    </head> 
    <body> 
        <form id="form1" runat="server"
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
        </telerik:RadScriptManager> 
        <div style="height:100%;">  
                    <telerik:RadSplitter ID="RadSplitter_Main" runat="server" Orientation="Vertical" Height="100%" Width ="100%" Skin="Office2007"
                        <telerik:RadPane ID="RadPane_left" runat="server" Scrolling="None" Width="100%"
                                         4444444444444444444444444444444444444444444 
                        </telerik:RadPane> 
                        <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode ="None"    /> 
                        <telerik:RadPane ID="RadPane_menu" runat="server" Scrolling="None" Width="50px"
                            <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" ExpandedPaneId="RadSlidingPane1" SlideDirection="Left"
                                <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Menu1" Scrolling="None" EnableDock ="true" > 
                                    <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Office2007"
                                        <Items> 
                                            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem1"
                                            <Items > 
                                            <telerik:RadPanelItem  Text ="123" ></telerik:RadPanelItem> 
                                            </Items> 
                                            </telerik:RadPanelItem> 
                                            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem2"
                                            </telerik:RadPanelItem> 
                                            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem3"
                                            </telerik:RadPanelItem> 
                                            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem4"
                                            </telerik:RadPanelItem> 
                                            <telerik:RadPanelItem runat="server" Text="Root RadPanelItem5"
                                            </telerik:RadPanelItem> 
                                        </Items> 
                                    </telerik:RadPanelBar> 
                                </telerik:RadSlidingPane> 
                                <telerik:RadSlidingPane ID="RadSlidingPane2" runat="server" Title="Menu2" Scrolling="None"
                                </telerik:RadSlidingPane> 
                            </telerik:RadSlidingZone> 
                        </telerik:RadPane> 
                    </telerik:RadSplitter> 
        </div> 
        </form> 
    </body> 
    </html> 
     
    1-  hi telerik
    in first view my panel is not docket to right edge of my browser
    but if i click in dock it will be docket to right

    can u help me?
    2-does this splitter suporrts rtl mode?

    tnx
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 29 Jul 2009 Link to this post

    Hi ehsan,

    Straight to your questions:

    1. There was a bug in the 2009.1.402 version which causes exactly the behavior you report and the problem occurs only when the SlideDirection is set to Left. The bug is already fixed and I recommend to upgrade to the latest Q2 release - this will solve the problem. I also prepared a workaround for you and attached your modified page in case you prefer not to upgrade.
    2. Yes, the RadSplitter supports RTL but this is still not official and you can test the RTL mode in teh latest internal build. More information about the internal build system is available below:


      http://telerikwatch.com/2009/01/latest-internal-radcontrol-builds-now.html

    I hope that the provided information and modified page are helpful, in case you need further assistance do not hesitate to contact us again!

    Regards,
    Svetlina
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ali Rad
    Ali Rad avatar
    3 posts
    Member since:
    Sep 2009

    Posted 24 Sep 2009 Link to this post


    The workaround attached working well if you use Q1 2009 which is not officially support rtl ( Right to Left ), and you page was all designed for rtl support. very good solution! even if your pages renders right to left but the splitter works well.
    But after using Q2 2009 with all previous condition without any changes the splitter and it's rad panel in it doesn't work and it renders completely wrong.I had to do some changes including :
    CollapseMode="Forward" for telerik:RadSplitBar and
    SlideDirection="Right" for telerik:RadSlidingZone
    with these changes some problems solved but others remained, and they are:
    1)if you click on text RadSlidingPane  it does not render correctly, and does not expand, also radpanel renders incorrectly also.
    2)if you press the Dock button RadSlidingPane  moves to the left after the Radpanel and still Radpanel renders incorrectly.
    3) By selecting the Radpanel Group During test # 2 you can see that some groups disappear.

    please set the dir="rtl" in the proper page tags in your solution thus the page whole page renders from right to left then  try to raise the rad splitter and rad panel events by clicking on every clickable items and see the result.
    It seems that supporting rtl for the new release has not fully tested and it's side affect on radpanelbar.

    Could you please make the necessary changes to your workaround based on the latest release Q2 2009 or the latest internal build and update the javascript you have prepared to work when your page has dir="rtl" property in the page tags to support right to left ?


    Best Regards


  5. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 29 Sep 2009 Link to this post

    Hi Ali Rad,
    The javascript workaround was for the previous version of the RadSplitter the you used. It is not applicable for the latest version of the code and you should remove it. As for the position of the RadSliding pane - the RadSplitter renders as a TABLE element and as you probably know, in rtl mode, the cells of a TABLE element are automatically rendered from right to left. That is why, when you declared first an empty RadPane and then a RadPane with a RadSlidingZone, the empty pane is displayed on the right of the screen and the pane with the sliding zone is displayed on the left. This behavior is expected.

    In case you want to achieve the same effect as in the page that Svetlina sent you and that had dir=ltr, you should use the following code:
    <head id="Head1" runat="server"
        <title></title
        <style type="text/css"
            html, body, form 
            { 
                margin: 0; 
                padding: 0; 
                height: 100%; /* needed for container min-height */ 
                overflow: hidden; 
                direction: rtl; 
            } 
        </style> 
    </head> 
    <body> 
        <form id="form1" runat="server"
        <asp:ScriptManager ID="ScriptManager1" runat="server"
        </asp:ScriptManager> 
        <telerik:RadSplitter ID="RadSplitter_Main" runat="server" Orientation="Vertical" 
            Height="100%" Width="100%" Skin="Office2007"
            <telerik:RadPane ID="RadPane_menu" runat="server" Scrolling="None" Width="22px"
                <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" SlideDirection="Right"
                    <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Menu1" Scrolling="None" 
                        EnableDock="true"
                        <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Office2007" Style="direction: rtl;"
                            <Items> 
                                <telerik:RadPanelItem runat="server" Text="Root RadPanelItem1"
                                    <Items> 
                                        <telerik:RadPanelItem Text="123"
                                        </telerik:RadPanelItem> 
                                    </Items> 
                                </telerik:RadPanelItem> 
                                <telerik:RadPanelItem runat="server" Text="Root RadPanelItem2"
                                </telerik:RadPanelItem> 
                                <telerik:RadPanelItem runat="server" Text="Root RadPanelItem3"
                                </telerik:RadPanelItem> 
                                <telerik:RadPanelItem runat="server" Text="Root RadPanelItem4"
                                </telerik:RadPanelItem> 
                                <telerik:RadPanelItem runat="server" Text="Root RadPanelItem5"
                                </telerik:RadPanelItem> 
                            </Items> 
                        </telerik:RadPanelBar> 
                    </telerik:RadSlidingPane> 
                    <telerik:RadSlidingPane ID="RadSlidingPane2" runat="server" Title="Menu2" Scrolling="None"
                    </telerik:RadSlidingPane> 
                </telerik:RadSlidingZone> 
            </telerik:RadPane> 
            <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="None" /> 
            <telerik:RadPane ID="RadPane_left" runat="server" Scrolling="None"
                4444444444444444444444444444444444444444444 
            </telerik:RadPane> 
        </telerik:RadSplitter> 
        </form> 
    </body> 
    </html> 
     

    I was not able to reproduce the problem with the RadPanelBar. Could you please try setting explicit width to the control and check whether this will make a difference? For example:
    <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Menu1" Scrolling="None" 
        EnableDock="true" Width="205px"
        <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Office2007"  
        Width="200px"

    In case this does not help you, post the code of your page here and provide detailed information how we can reproduce the problem - e.g. which browser you use, steps we need to follow, etc.

    Best wishes,
    Tsvetie
    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.
  6. ehsan
    ehsan avatar
    27 posts
    Member since:
    Apr 2008

    Posted 30 Sep 2009 Link to this post

    hi ali
    this works fine in 2009.2.826.35
    <body dir="rtl"
     <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="100%" Height="100%"
            <telerik:RadPane ID="RadPane2" runat="server" Width="200px"></telerik:RadPane> 
            <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="Backward"></telerik:RadSplitBar> 
            <telerik:RadPane ID="RadPane1" runat="server"
            </telerik:RadPane> 
        </telerik:RadSplitter> 
    </body> 

  7. Ali Rad
    Ali Rad avatar
    3 posts
    Member since:
    Sep 2009

    Posted 04 Oct 2009 Link to this post

    Thanks for your help,
    As ehsan suggested and also good comments of Tsvetie, the problem has been solved,
    Thanks you,

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017