RadWindow ContentTemplate, RadFormDecorator and DropDownList

[Kern Shen]

There seems to be a bug when a dropdownlist is placed in a RadWindow's ContentTemplate and is decorated by RadFormDecorator.

With RadFormDecorator, the RadWindow will appear with scrollbars.  Seems like RadFormDecorator screw up RadWindows AutoSize height calculation.

    <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" />
    <telerik:RadWindow runat="server" ID="wUserForm" VisibleOnPageLoad="true" AutoSize="true">
        <ContentTemplate>
            <table>
                <tr>
                    <td>test</td>
                    <td>
                        <asp:DropDownList ID="DropDownList1" runat="server">
                            <asp:ListItem>aaaaaaaa</asp:ListItem>
                            <asp:ListItem>bbbbbbbb</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
            </table>
        </ContentTemplate>
    </telerik:RadWindow>

[Marin Bratanov]

Hi Kern,

You need to redecorate the content of the RadWindow after you show it, because it is moved in the DOM at this point. Once this is done some dimensions of the elements may change, so you could call the autoSize() method again

<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" />
<telerik:RadWindow runat="server" ID="wUserForm" VisibleOnPageLoad="true" AutoSize="true" OnClientShow="decorateContent">
    <ContentTemplate>
        <table>
            <tr>
                <td>
                    test
                </td>
                <td>
                    <asp:DropDownList ID="DropDownList1" runat="server">
                        <asp:ListItem>aaaaaaaa</asp:ListItem>
                        <asp:ListItem>bbbbbbbb</asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
        </table>
    </ContentTemplate>
</telerik:RadWindow>
<script type="text/javascript">
    function decorateContent(sender)
    {
        $find("<%=RadFormDecorator1.ClientID %>").decorate(sender.get_contentElement());
        setTimeout(function ()
        {
            sender.autoSize();
        }, 0)
    }
</script>

This works fine with me and you can find attached several screenshots with the appearance before and after adding the script.

If this is not the case with you could you confirm that you are using the latest version and if not - does upgrading help?

Greetings,
Marin Bratanov
the Telerik team

[Kern Shen]

I see, thanks for the advice!

[Kern Shen]

Is there anyway I can do this elegantly for all RadWindows without having to repeat the javascript?

[Marin Bratanov]

Hello Kern ,

You can attach the same handler for all RadWindows that need it. It uses the Client-side API of the control to pass the current content to RadFormDecorator, so it will work with various instances.


Greetings,
Marin Bratanov
the Telerik team