Hiding a RadGrid, then showing is losing it's Skin

6 posts, 0 answers
  1. Robert LeGood
    Robert LeGood avatar
    28 posts
    Member since:
    Dec 2007

    Posted 22 Jan 2008 Link to this post

    Hi all,

    If I have a RadGrid hidden on the page (either through setting it's property or doing it dynamically at runtime in Page_Load), and then later make it visible, it looses all it's Skin information.   Here's a quick sample page I created to demonstrate the problem..  I tried also using the RadScriptManager and got the same effect.

    Thanks!!

    ASP.NET

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="HiddenRadGridTest.aspx.cs" Inherits="HiddenRadGridTest" %> 
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server"
        <title>Untitled Page</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"
            &nbsp;<asp:ScriptManager ID="ScriptManager1" runat="server"
            </asp:ScriptManager> 
            &nbsp;<div> 
                <br /> 
                <asp:UpdatePanel ID="UpdatePanel1" runat="server"
                    <ContentTemplate> 
                        &nbsp;<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /> 
                        <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="dsTest" GridLines="None" 
                            Visible="False"
                            <ExportSettings> 
                                <Pdf FontType="Subset" PaperSize="Letter" /> 
                                <Excel Format="Html" /> 
                            </ExportSettings> 
                            <MasterTableView AutoGenerateColumns="False" CommandItemDisplay="None" CurrentResetPageIndexAction="SetPageIndexToFirst" 
                                DataKeyNames="CustomerID" DataSourceID="dsTest" Dir="LTR" Frame="Border" TableLayout="Auto"
                                <EditFormSettings> 
                                    <EditColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType"
                                    </EditColumn> 
                                </EditFormSettings> 
                                <Columns> 
                                    <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="CustomerID" 
                                        FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="CustomerID" 
                                        ReadOnly="True" SortExpression="CustomerID" UniqueName="CustomerID"
                                    </telerik:GridBoundColumn> 
                                    <telerik:GridBoundColumn CurrentFilterFunction="NoFilter" DataField="CustomerName" 
                                        FilterListOptions="VaryByDataType" ForceExtractValue="None" HeaderText="CustomerName" 
                                        SortExpression="CustomerName" UniqueName="CustomerName"
                                    </telerik:GridBoundColumn> 
                                </Columns> 
                                <ExpandCollapseColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                                    Resizable="False" Visible="False"
                                    <HeaderStyle Width="20px" /> 
                                </ExpandCollapseColumn> 
                                <RowIndicatorColumn CurrentFilterFunction="NoFilter" FilterListOptions="VaryByDataType" 
                                    Visible="False"
                                    <HeaderStyle Width="20px" /> 
                                </RowIndicatorColumn> 
                            </MasterTableView> 
                        </telerik:RadGrid><br /> 
                        &nbsp;<asp:SqlDataSource ID="dsTest" runat="server" ConnectionString="<%$ ConnectionStrings:XXX_ConnectionString %>" 
                            SelectCommand="SELECT * FROM [MyTable]"></asp:SqlDataSource> 
                    </ContentTemplate> 
                </asp:UpdatePanel> 
                &nbsp;</div> 
        </form> 
    </body> 
    </html> 


    C# CODEBEHIND
    using System; 
    using System.Data; 
    using System.Configuration; 
    using System.Collections; 
    using System.Web; 
    using System.Web.Security; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
    using System.Web.UI.WebControls.WebParts; 
    using System.Web.UI.HtmlControls; 
     
    public partial class HiddenRadGridTest : System.Web.UI.Page 
        protected void Page_Load(object sender, EventArgs e) 
        { 
             
        } 
        protected void Button1_Click(object sender, EventArgs e) 
        { 
            Button1.Visible = false
            RadGrid1.Visible = true
        } 


  2. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 23 Jan 2008 Link to this post

    Hi Robert,

    This is a known limitation of the MS AJAX framework - it simply does not update the page head element. To resolve the problem you have several options:
    • have another RadControl instance on the page. This will ensure that the styles are properly registered
    • manually hardcode the styles in the head section. You can see what styles are registered by having visible radgrid on the page.
    • use our RadAjaxManager - it properly updates the head and the controls register their scripts.
    Hope these help.
    Regards,
    Steve
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. ClarkSRoberts
    ClarkSRoberts avatar
    27 posts
    Member since:
    Mar 2007

    Posted 10 Jun 2009 Link to this post

    Can you explain the options you gave clearly.

    • have another RadControl instance on the page. This will ensure that the styles are properly registered -- what does this actually mean? Drop another (any) rad control on the page?
    • use our RadAjaxManager - it properly updates the head and the controls register their scripts. What does "use our RadAjaxManager" - have the RadAjaxManager control the ajax instance and have the RadGrid associated with it. Or just have it on the page?
  5. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 11 Jun 2009 Link to this post

    Hello ClarkSRoberts,

    Straight onto your points:

    • You can add an instance of the same control on the page and set its style->display attribute to none to hide it from the user. Thus the styles will be registered as expected when you show the other control instance (initially hidden on the server) on ajax request.
    • Indeed you need to associate the ajax manager with the grid by wrapping the grid in asp Panel for example (always visible container) and marking the panel as an initiator and updated control via the manager's settings.
    Kind regards,
    Sebastian
    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.
  6. Reunisoft
    Reunisoft avatar
    5 posts
    Member since:
    Aug 2008

    Posted 15 Feb 2011 Link to this post

    Today I had the same issue (maintenance on an old website using old telerik components).

    The radgrid did lose its skin when updated through need data source event handler.

    I moved the radgrid into an <asp:panel /> and now it's ok.

    Thanks for these precious information here :)
  7. Hari Prasad
    Hari Prasad avatar
    1 posts
    Member since:
    Mar 2010

    Posted 10 Jul 2012 Link to this post

    After setting EnableAjaxSkinRendering=true on postback, it retains the skin.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017