This is a migrated thread and some comments may be shown as answers.

RadAjax and UpdatePanelsRenderMode Inline

4 Answers 370 Views

Ajax

This is a migrated thread and some comments may be shown as answers.

Sabrina asked on 16 Apr 2009, 07:22 AM

Hi !

I have a problem with the UpdatePanelsRenderMode Inline. When I use it, the buttons are aligned in block mode and then, after on second, they are aligned in inline mode.

There is a way to avoid that ?

Thank you,

Sabrina

Here is the example :

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title>Untitled Page</title> 
        
                <style type="text/css">  
        
                .MyModalPanel  
        
            {  
        
                position:absolute;  
        
                top:0;  
        
                left:0;  
        
                width:100%;  
        
                height:100%;  
        
                margin:0;  
        
                padding:0;  
        
                background:#ffa url(img/loading.gif) center center no-repeat;         
        
            }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <div> 
        
                <telerik:RadScriptManager ID="MainRadScriptManager" runat="server">  
        
                    </telerik:RadScriptManager> 
        
                <table> 
        
                <tr>voici un peu de texte</tr> 
        
                 <tr>          
        
                        <telerik:RadCodeBlock runat="server">       
        
                        <td align="right" valign="bottom" style="border: none">                  
        
                           <asp:Button ID="DeleteBtn" runat="server" Text="<%$ Resources:Resource, TEST_TEXT1%>" 
        
                                    CausesValidation="false" UseSubmitBehavior="false" />&nbsp;  
        
                           <asp:Button ID="ClearBtn" runat="server" Text="<%$ Resources:Resource, TEST_TEXT2%>" 
        
                                    CausesValidation="false" UseSubmitBehavior="false" />                                      
        
                        </td> 
        
                        </telerik:RadCodeBlock> 
        
                    </tr> 
        
                </table>    
        
                    <telerik:RadAjaxManager ID="RadAjaxManagerProxy1" runat="server" UpdatePanelsRenderMode="Inline">  
        
                    <AjaxSettings> 
        
                       <telerik:AjaxSetting AjaxControlID="DeleteBtn">  
        
                            <UpdatedControls> 
        
                               <telerik:AjaxUpdatedControl ControlID="DeleteBtn" LoadingPanelID="AjaxLoadingPanel">  
        
                               </telerik:AjaxUpdatedControl> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting>                                  
        
                        <telerik:AjaxSetting AjaxControlID="ClearBtn">  
        
                            <UpdatedControls> 
        
                               <telerik:AjaxUpdatedControl ControlID="ClearBtn" LoadingPanelID="AjaxLoadingPanel">  
        
                               </telerik:AjaxUpdatedControl> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                       </AjaxSettings> 
        
                    </telerik:RadAjaxManager> 
        
                     <telerik:RadAjaxLoadingPanel ID="AjaxLoadingPanel" runat="server" Transparency="20" style="z-index: 10000" 
        
                        BackColor="#E0E0E0" IsSticky="true" Width="100%" Height="100%" CssClass="MyModalPanel">         
        
                    </telerik:RadAjaxLoadingPanel> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

4 Answers, 1 is accepted

Accepted

answered on 16 Apr 2009, 08:34 AM

Hi Sabrina,

You can prevent the flickering if you apply a display:inline CSS style to the update panels initially:

HTML

    
                        <td  class="InlinePanels">                   
        
                           <asp:Button ID="DeleteBtn" runat="server" Text="TEST_TEXT1"  
        
                                    CausesValidation="false" UseSubmitBehavior="false" />&nbsp;   
        
                           <asp:Button ID="ClearBtn" runat="server" Text="TEST_TEXT2"  
        
                                    CausesValidation="false" UseSubmitBehavior="false" />                                       
        
                        </td>

CSS

    
            .InlinePanels div 
        
            { 
        
                display:inline; 
        
            }

Sincerely yours,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.