DockedPaneId fails if Pane is hidden

[Jack]

I am writing to determine if the behavior I'm seeing is intended functionality or if I've made a simple mistake.  I have configured the Telerik controls on my my master page as follows:

<telerik:RadSplitter ID="LeftSide" runat="server" Width="28px">
    <telerik:RadPane ID="ParamsPane" runat="server" Scrolling="none" Locked="false" BackColor="#FFCC00">
        <telerik:RadSlidingZone ID="ParamsSlidingZone" runat="server">
            <telerik:RadSlidingPane ID="ParamsSlidingPane" runat="server" Title="Parameters"
                Width="300px" BackColor="#FFCC00" MinHeight="400" MinWidth="300">
                <p>
                    <asp:Label ID="noCookie" runat="server" Text="As this is the first time you are running these dashboards, please set your preferred values for the following parameters.<br /><br />"
                        Font-Size="Large" ForeColor="#C41200" Visible="False"></asp:Label>
                </p>
                <p>
                    <telerik:RadPanelBar Skin="Gray" ID="PickersPanelBar" runat="server" AllowCollapseAllItems="true"
                        ExpandMode="SingleExpandedItem" EnableViewState="true" Width="100%">
                        <Items>
                            <telerik:RadPanelItem Text="Case Type" runat="server">
                                <Items>
                                    <telerik:RadPanelItem runat="server">
                                        <ItemTemplate>
                                            Picker Control Goes Here
                                        </ItemTemplate>
                                    </telerik:RadPanelItem>
                                </Items>
                            </telerik:RadPanelItem>




                        </Items>
                        <CollapseAnimation Duration="100" Type="None" />
                        <ExpandAnimation Duration="100" Type="None" />
                    </telerik:RadPanelBar>
                </p>
                <p style="text-align: right">
                    <br />
                    <asp:Button ID="submitPickers" runat="server" Text="Save & Run" OnClick="submitPickers_Click" />
                </p>
            </telerik:RadSlidingPane>
        </telerik:RadSlidingZone>
    </telerik:RadPane>
    <telerik:RadPane ID="RightPane" runat="server" Scrolling="none" MinWidth="600">
        <telerik:RadSplitter ID="RightSide" runat="server" Orientation="horizontal" Width="600px">
            <telerik:RadPane ID="TabsPane" runat="server" Scrolling="none" Locked="true" BackColor="#FFCC00"
                MinHeight="28" MinWidth="600">
                <telerik:RadTabStrip ID="DashboardTabs" runat="server" Skin="Telerik">
                    <Tabs>
                        <telerik:RadTab runat="server" Text="Quality" NavigateUrl="Quality.aspx" ImageUrl="~/Images/GreenCircleCheck.GIF">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Backlog" NavigateUrl="Backlog.aspx" ImageUrl="~/Images/OrangeWarning.GIF">
                        </telerik:RadTab>
                    </Tabs>
                </telerik:RadTabStrip>
            </telerik:RadPane>
            <telerik:RadPane ID="ContentsPane" runat="server" Scrolling="none" BackColor="#FFCC00"
                MinHeight="400" MinWidth="600">
                <asp:ContentPlaceHolder ID="cphDashboard" runat="server">
                </asp:ContentPlaceHolder>
            </telerik:RadPane>
            <telerik:RadPane ID="FooterPane" runat="server" Scrolling="none" Locked="true" BackColor="#FFCC00"
                MinHeight="28" MinWidth="600">
                <table width="100%">
                    <tr>
                        <td style="width: 99%">
                            <p style="font-size: medium; text-align: center">
                                SymMetrics Dashboards</p>
                        </td>
                        <td style="width: 1%">
                            <asp:Button ID="RescaleButton" runat="server" Text="Rescale" OnClick="RescaleButton_Click" />
                        </td>
                    </tr>
                </table>
            </telerik:RadPane>
        </telerik:RadSplitter>
    </telerik:RadPane>
</telerik:RadSplitter>

I am checking for a cookie on the user's computer and if it doesn't exist then I'm expanding the ParamsSlidingPane RadSlidingPane to fill the browser window, pin it, and then disallow unpinning so that they are forced to use the submit button to validate the selections made on the RadSlidingPane and then write them to a cookie.  I set the session variable for WindowWidth using another page with some Javascript.  As that isn't pertinent to this, I'm not including it.  Here is the server-side code for the above described:

// Check user's cookies for picker values
HttpCookie Parameters = Request.Cookies["Parameters"];
// If there is no cookie...
if (Parameters == null)
{
    // ...slide the pickers pane to full screen width...
    ParamsSlidingPane.Width = Unit.Pixel(int.Parse(Session["WindowWidth"].ToString()) - (int)ParamsPane.Width.Value - 2);
    ParamsSlidingZone.ExpandedPaneId = ParamsSlidingPane.ClientID;
    // ...pin it...
    ParamsSlidingZone.DockedPaneId = ParamsSlidingPane.ClientID;
    // ...block unpinning so they have to use the submit button...
    ParamsSlidingPane.OnClientBeforeUndock = "BlockUndock";
    // ...hide the right pane...
    RightPane.Visible = false;
    // ...and show a message
    noCookie.Visible = true;
}

The code I'm using to prevent unpinning of the ParamsSlidingPane is simple and provided mainly for anyone else, like myself, who has been puzzling over this but also for completeness.

<script type="text/javascript">
    function BlockUndock(sender, Args)
    {
        Args.set_cancel(true);
    }
</script>

That described, the behavior is that if I hide the RightPane RadPane, then the ParamsSlidingPane RadSlidingPane won't pin.  If I comment out the code to hide the RightPane RadPane, then it pins fine but that causes scroll bars to occur and the contents of the RightPane, which are invalid until the cookie is set, can be seen if the user scrolls over.  If I comment out the RightSide RadSplitter, then the pinning works fine but I still get scroll bars with no contents, only the frame of the RadSplitter.

The goal here is simple -- show the parameters pane if there is no cookie and don't let the user see anything but the parameters pane until he sets the parameters.  Any guidance would be appreciated.

[Tsvetie]

Hi Jack,
By design, in order to be able to dock a RadSlidingPane, you have to have at least 2 RadPanes, defined in the RadSplitter. That must is based on the fact that when you dock a RadSlidingPane, you force it into its parent RadPane. At this point, in order for the RadSlidingPane to show all its content (), it resizes its parent RadPane. However, you can resize a RadPane only in case you have another RadPane that will resize with the same delta, so that the RadSplitter keeps its size.

That is why, you cannot dock a RadSlidingPane, in case you have a single RadPane in the RadSplitter.

Please use:

RightPane.Collapsed = true;

instead of:

RightPane.Visible = false;

Sincerely yours,
Tsvetie
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.