Sliding Zone Width

2 posts, 0 answers
  1. Robin
    Robin avatar
    30 posts
    Member since:
    Jun 2012

    Posted 31 Aug 2012 Link to this post

    Hi,

    I would like the RadSlidingZone of my project to be invisible when a certain SlidingPane ist expanded (and regain it's visibility when that SlidingPane collapses). I've tried the following code, but it doesn't seem to work:

    function OnClientDock(sender, eventArgs)
    {
                    var slidingZone = $find("<%=RadSlidingZone1.ClientID %>");
                    slidingZone.Width = "0px"; ;
    }
     
    function OnClientUndock(sender, eventArgs)
     {
                    var slidingZone = $find("<%=RadSlidingZone1.ClientID %>");
                    slidingZone.Width = "22px";
    }


    <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" DockedPaneID="RadSlidingPane1" >
     
                <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server"  Title="SlidingPane"
                        EnableResize="False" OnClientBeforeDock="OnClientDock" OnClientBeforeUndock="OnClientUndock">
     
                 [...]
     
                 </telerik:RadSlidingPane>
     
    </telerik:RadSlidingZone>

    Any suggestions on how to fix this would be of great help.
    Thanks in advance,
    Robin
  2. Vessy
    Admin
    Vessy avatar
    1389 posts

    Posted 05 Sep 2012 Link to this post

    Hi Robin,

    I review the code bellow and noticed that you are trying to set values to a "Width" property. Thus this property is not a part from the standard SlidingZone's functionality, its value is being applied correctly but the SlidingZone never uses is.

    In order to achieve the desired scenario you could use the following approach:
    <script type="text/javascript">
        function OnClientDock(sender, eventArgs) {
            var tabContainer = sender.getTabContainer();
            $telerik.$(tabContainer).parent().css('display', 'none');
        }
     
        function OnClientUndock(sender, eventArgs) {
            var tabContainer = sender.getTabContainer();
            $telerik.$(tabContainer).parent().css('display', '');
        }
    </script>

    All the best,
    Veselina
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top