Dock Size (to render graph)

4 posts, 0 answers
  1. Mark Davison
    Mark Davison avatar
    82 posts
    Member since:
    Jul 2005

    Posted 12 Jun 2007 Link to this post

    Hi,

    We are using the "Docking" functionality to create a customisable "dashboard" for our users. We need to have the ability to render a graph inside a dockable object. We have this working fine now but we need to be able to determine the width of the dockable object so we can create a graph which fits the dockable object. Can we get the height and width of the dockable object via javascript?

    Also, as an additional question, is it possible to change a dockable objects height using javascript i.e. when the user clicks a button on the page, we set a dockable objects height to be double it's current size?

    Regards,

    Mark
  2. Petya
    Admin
    Petya avatar
    869 posts

    Posted 13 Jun 2007 Link to this post

    Hello Mark Davison,

    Here is some code how you can achieve this:

    <telerik:raddock id="Raddock1" width="200px" height="99px" runat="server" text="dock1">
    <input type="button" id="button1" value="click" onclick="getSize()" />

    <script type="text/javascript">
                function getSize()
                {
                    var dock = $find('<%= Raddock1.ClientID%>');
                    alert(dock.get_Width());
                    alert(dock.get_Height());
                    dock.get_element().style.height = 200;
                    dock._setContentContainerHeight();
                    dock.get_element().style.width = 50;
                }
    </script>

    Let me know if you have other questions.

    Greetings,
    Petya
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Mark Davison
    Mark Davison avatar
    82 posts
    Member since:
    Jul 2005

    Posted 13 Jun 2007 Link to this post

    Hi,

    Thanks for the reply, one further question!

    If I use 

    var currheight=dock.get_Height();
    dock.get_element().style.height = parseFloat(currheight)+200 + 'px';
    dock._setContentContainerHeight();

    Then I would expect the height to keep increasing by 200px but it does not. 

    currheight is always reported as being the original size. Is there any way I can call this so that the dock keeps getting bigger?

    Regards,

    Mark

  4. Mark Davison
    Mark Davison avatar
    82 posts
    Member since:
    Jul 2005

    Posted 13 Jun 2007 Link to this post

    Hi,

    I have modified your code slightly! This seems to do exactly what I want. Thanks for your help.

    var cid = sender.get_RadDock().get_id();
    var dock=$find(cid);
    var currheight=dock.get_element().style.height; //dock.get_Height();
    var minheight=200;
    dock.get_element().style.height = parseFloat(currheight)+parseFloat(minheight) + 'px';
    dock._setContentContainerHeight();

    Regards,

    Mark

Back to Top