How to set Rad Dock's position on a client

2 posts, 0 answers
  1. Albert Abuzarov
    Albert Abuzarov avatar
    1 posts
    Member since:
    Nov 2009

    Posted 17 Nov 2009 Link to this post

    I have a Rad Dock on a page. I need it to be positioned in a certain place on the page (in the top-right corner of a Panel, i.e. <div>).
    Since actual coordinates and size of the panel are not available on the server side, I'm trying to set up a client script that moves a RadDock to the required position right after the page is loaded.

    This might be relevant to the problem: I do not have RadDockLayout and RadDockZone on the page. I use master page.

    What I have in aspx (I omitted some unrelated elements):

    <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="Server"> 
       <asp:Panel runat="server" id="RequestFormPanel" BackColor="Green" > 
           
            <asp:Panel runat="server" ID="requestPanel" CssClass="FormPanel" BackColor="Red" > 
            </asp:Panel> 
     
            <telerik:RadDock runat="server" ID="IRItemListDock" Title="Информационные ресурсы" EnableAnimation="true" Visible="false" DefaultCommands = "ExpandCollapse" > 
                <ContentTemplate> 
                    <uc2:IRItemList ID="IRItemList1" runat="server" /> 
                </ContentTemplate> 
            </telerik:RadDock> 
             
        </asp:Panel>      
    </asp:Content> 

    What I did:

    I wrote a JavaScript function to position the dock:

         function MoveDock(DockId, PanelId)   
         {   
            var currentDock = $find(DockId.id);   
            if ( currentDock == null ) { return; } 
     
            obj = document.getElementById(PanelId.id); 
            var x = 0; 
            var y = 0; 
            while (obj != null) 
            { 
              x += obj.offsetLeft; 
              y += obj.offsetTop; 
            } 
            
            currentDock.set_left(x);   
            currentDock.set_top(y);   
         }   


    In codebehind (OnInit) I attach the client function to the page:
    Page.RegisterStartupScript("Startup", "<script language=JavaScript>MoveDock(" + IRItemListDock.ClientID + "," + requestPanel.ClientID + ");</script>"); 

    The client function starts as expected, but $find(DockId.id) always returns null.

    How to make all this work?
  2.
  3. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 19 Nov 2009 Link to this post

    Hi Albert,

    In the codebehind you are actually passing the ClientID of the RadDock, so you should use the following method to find the client-object of the current RadDock:

    var currentDock = $find(DockId);

    Another thing is that I am not sure whether the DockId.id and PanelId.id will return a value different than "null" because you are passing parameters of type string (from the codebehind) and the JavaScript string does not have such a property.

    So to get a reference to the HTML element of the asp:Panel again use only the PanelId, i.e.:

    var obj = document.getElementById(PanelId);


    Kind regards,
    Pero
    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.
Back to Top