problem about textbox display?

2 posts, 0 answers
  1. Nick Wu
    Nick Wu avatar
    22 posts
    Member since:
    Aug 2005

    Posted 29 May 2010 Link to this post

    My page :

     <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="Textbox, Textarea,Buttons,Scrollbars" /> 
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">    
        <telerik:AjaxSetting AjaxControlID="toolbar">  
                       <telerik:AjaxUpdatedControl ControlID="pnlDetail" LoadingPanelID="rlpDefault" /> 
        <telerik:RadAjaxLoadingPanel ID="rlpDefault" runat="server" /> 
     <telerik:RadToolBar ID="toolbar" runat="server" Width="100%" > 
       <%--- toolbar content   ----%> 
    <telerik:RadWindow  ID="rwDetail" ...> 
      <asp:Panel id="pnlDetail" runat="server">
       <asp:TextBox ID="tbxGridId" runat="server" Width="250px"></asp:TextBox> 
       <%--- other Content ---%> 
    Click toolbar button , I use client script to  open the window first.  The button's postback is true, then on server side ,get data from database to update the detail panel.  The Code works well.
    But the FormDecorator can  not apply to the textbox correctly. (see the attached file)

    if I open the window by sending the  javascript to client after update the detail panel on server side, the textbox display correctly.
    but this is not I want , because I want the user can see the loading procedure.

    any suggestion?
  2. Bozhidar
    Bozhidar avatar
    693 posts

    Posted 03 Jun 2010 Link to this post

    Hello Nick,

    The problem comes as RadFromDecorator inherits some styles form RadWindow. In CSS3 friendly browsers, we user border-radius property to create rounded corners. IE does not support that property and we apply a table around the element. In your case that table inherits some unwanted styles from RadWindow table. The solution is to set the RadFormDecorator table cell rules heavier, so they will be able to apply correctly:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <head runat="server">
        <script type="text/javascript">
            function OpenWindow()
        <style type="text/css">
            .rfdRoundedWrapper tr td
                vertical-align: middle;
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="Textbox, Textarea,Buttons,Scrollbars" />
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                <telerik:AjaxSetting AjaxControlID="Button1">
                        <telerik:AjaxUpdatedControl ControlID="pnlDetail" LoadingPanelID="rlpDefault" />
        <telerik:RadAjaxLoadingPanel ID="rlpDefault" runat="server" />
        <asp:Button ID="Button1" runat="server" Text="Open Window" OnClientClick="OpenWindow();" />
        <telerik:RadToolBar ID="toolbar" runat="server" Width="100%">
            <%--- toolbar content   ----%>
        <telerik:RadWindow ID="rwDetail" runat="server" VisibleOnPageLoad="false">
                <asp:Panel ID="pnlDetail" runat="server">
                    <asp:TextBox ID="tbxGridId" runat="server" Width="250px"></asp:TextBox>
                    <%--- other Content ---%>

    You should add the yellow marked CSS in the head of your document.
    Please, find attached rfdandrwfixed.gif showing the fixed problem, and rfdandrwunfixed.gif showing the case before the fix.

    This fix will be included in our next release.

    All the best,
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top