How to undock a RadSlidingZone/RadSlidingPane programmatically in javascript

3 posts, 0 answers
  1. Richard
    Richard avatar
    20 posts
    Member since:
    Nov 2011

    Posted 02 Apr 2012 Link to this post

    Hello Telerik-Team,
    I know in some threads this problem is adressed, but I could not found a solution.

    This is what I am doing, or rather would do, in my project.

    I have a vertical RadSplitter control which contains in the left pane a RadScheduler and in the right pane another RadSplitter control. The RadSplitter control in the right pane is inside a RadSlidingZone/RadSlidingPane control.

    At the start, the RadSlidingZone on the right is slided out, so the RadScheduler control is visible in the maximum width, which is working perfectily.

    My goal is now, only to show a zoned out RadSlidingZone if the currently selected view of the RadScheduler (the left part of the vertical RadSplitter) is DayView or WeekView, i.e. when the user switches to the MonthView two two things should happen:

    1. If in the DayView or in the WeekView the right part, i.e. the SlidingZone, was visible, it should zone out, so the month view has its maximal width

    2. The button to slide in or out the sliding zone should be disabled, or at least not work if the user clicks it.

    The second part works fine, i.e. I wrote a javascript function which is called with the right sliding out event, i.e. if the user clicks the SlidingZone button, I check in the java script method if the selected view is the month view, and if yes the event will be canceled (I found this trick on the forum, thanks a lot :-))

    My problem is the first thing:
    I found in this forum a way to automatically slide out the sliding zone, using the javascript functions RadSlidingZone.undock(<SlidingPaneId>) (if the pane is docked) or RadSlidingZone.collapse(<SlidingPaneId>) (if the pane is only expanded)

    The RadSlidingZone.collapse() method works fine, i.e. at after changing the view (I do not use the navigation commands but an own combo box, i.e. I cannot use the OnNavigationCommand client event) and after loading the new html page I run a little java script . If the selected view is then month view, I call the collapse java script method. Naturally this works only if the RadSlidingZone is NOT DOCKED, but only expanded.

    But if I change to day view, expand the SlidingZone and dock it (or use the property to dock it automatically after expanding it) and then change back to the month view, the docked SlidingZone will not undock. I know, in this case I have to use the undock() method of the SlidingZone, but when I use this, the return value is simply false. When I debug this, the RadSlidingZone property with the ID of the expanded AND the property with the ID of the DOCKED pane are both "null", therefore the undock() method will not work (neither  the collapse() method).

    I read in the forum that it is possible to undock the RadSlidingPane back on the server in C# (the C#-property which holds the ID of the docked pane can simply be set to zero). I tried this, and yes, the former docked RadSlidingPane will vanish BUT the left pane of my RadSplitter control, i.e. the RadScheduler control, will not be expanded to the right. It's width will not be changed, so that the RadScheduler pane does not change but the docked sliding pane will undock and therefore the area on the right of my vertical RadSplitter control is empty.

    Do you have any ideas?

    Is it possible to simulate the click of the undock button with java script? Because if the user first clicks the undock button and then changes the view type all works.

  2. Dobromir
    Dobromir avatar
    1633 posts

    Posted 05 Apr 2012 Link to this post

    Hi Richard,

    I am not quite sure I understand the following part:
    I do not use the navigation commands but an own combo box, i.e. I cannot use the OnNavigationCommand client event
    Are you using combobox to trigger an AJAX request? If so, are you updating / modifying the splitter during this request?

    Also, could you please provide the RadSplitter's configuration and the JavaScript that you are using to manually collapse / undock the sliding pane?

    All the best,
    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. Telerik UI for ASP.NET Core is out
  4. Richard
    Richard avatar
    20 posts
    Member since:
    Nov 2011

    Posted 13 Apr 2012 Link to this post

    Hi Dobromir,
    sorry for my late answer. Yes, I'm using a combo box to trigger an ajax request. I think I have missed to update the RadSplitter control during the ajax request. But since I can switch back to using the NavigationControls of the RadScheduler object and therefore can use the OnClientNavigationCommand event, I can easily undock the RadSlidingPane and my problem is solved.

    Thanks for your time,
Back to Top