Troubles with AjaxManager & WebUserControl

5 posts, 0 answers
  1. f_alonso
    f_alonso avatar
    5 posts
    Member since:
    May 2007

    Posted 14 Nov 2008 Link to this post

    Hi.

    We are trying to develope a webpage with the following elements:

                <radA:RadAjaxManager ID="ajaxMngr" runat="server" DefaultLoadingPanelID="ajaxMngrLP" OnResolveUpdatedControls="ajaxMngr_ResolveUpdatedControls"
                    <AjaxSettings> 
                        <radA:AjaxSetting AjaxControlID="listGrid"
                            <UpdatedControls> 
                                <radA:AjaxUpdatedControl ControlID="details" /> 
                                <radA:AjaxUpdatedControl ControlID="listGrid" /> 
                            </UpdatedControls> 
                        </radA:AjaxSetting> 
                    </AjaxSettings> 
                </radA:RadAjaxManager> 
                <radA:AjaxLoadingPanel ID="ajaxMngrLP" runat="server" Transparency="50"
                    <img src="RadControls/Ajax/Skins/Default/LoadingProgressBar.gif" alt="Loading..." 
                        style="border: 0;" /> 
                </radA:AjaxLoadingPanel> 
                <asp:Panel ID="details" runat="server"
                </asp:Panel> 
                <br /> 
                <radG:RadGrid ID="listGrid" runat="server" EnableAJAX="true" EnableAJAXLoadingTemplate="true" 
                    LoadingTemplateTransparency="55" PageSize="10" Skin="Green" OnNeedDataSource="listGrid_NeedDataSource" 
                    OnItemCreated="listGrid_ItemCreated" OnSelectedIndexChanged="listGrid_changeSelected" 
                    AllowPaging="True"
                    <MasterTableView Width="100%" DataKeyNames="ID" CommandItemDisplay="Top" Style="white-space: normal" 
                        GridLines="Vertical"
                    </MasterTableView> 
                    <ClientSettings EnablePostBackOnRowClick="true"
                        <Selecting AllowRowSelect="True" /> 
                    </ClientSettings> 
                    <PagerStyle Mode="NextPrevAndNumeric" ShowPagerText="False"></PagerStyle> 
                </radG:RadGrid> 




    The details panel contains a WebUserControl that we are loading like this:

        public void LoadUserControl(string controlName) 
        { 
            UserControl userControl = (UserControl)this.LoadControl(controlName); 
            userControl.ID = GetUserControlID(controlName); 
            this.details.Controls.Add(userControl); 
        } 
     

    This WebUserControl has the particularity its fields (RadTextBoxes, RadNumericTextBoxes,...) are retrieved from database, depending of the information we want to show. Our objective is when we change the selected row of the RadGrid, the WebUserControl data changes, but this AJAX reload of the control never arrives.

    We followed some feeds we found in the Telerik forums and Telerik examples, but we haven't success.

    Any help or suggestion?

    Thanks in advance.

  2. Kevin Babcock
    Kevin Babcock avatar
    189 posts
    Member since:
    Mar 2007

    Posted 16 Nov 2008 Link to this post

    Hello,

    I've created a simple example demonstrating how to use the OnSelectedIndexChanged event of the RadGrid to dynamically load a user control onto the page.

    DataControl.ascx
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DataControl.ascx.cs" Inherits="Telerik.Examples.DataControl" %> 
     
    <asp:Label ID="lblData" runat="server" /> 
     

    DataControl.ascx.cs
    using System; 
     
    namespace Telerik.Examples 
        public partial class DataControl : System.Web.UI.UserControl 
        { 
            public string Data { getset; } 
     
            protected void Page_Load(object sender, EventArgs e) 
            { 
                lblData.Text = String.Format("Selected Item: {0}"this.Data); 
            } 
        } 

    Default.aspx
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Telerik.Examples._Default" %> 
     
    <%@ 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>Example - Load a User Control Dynamically During an Ajax Request</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> 
             
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
                <AjaxSettings> 
                    <telerik:AjaxSetting AjaxControlID="RadGrid1"
                        <UpdatedControls> 
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> 
                            <telerik:AjaxUpdatedControl ControlID="Panel1" /> 
                        </UpdatedControls> 
                    </telerik:AjaxSetting> 
                </AjaxSettings> 
            </telerik:RadAjaxManager> 
             
            <asp:Panel ID="Panel1" runat="server"></asp:Panel> 
             
            <telerik:RadGrid ID="RadGrid1" runat="server"  
                AllowPaging="True"  
                AllowSorting="True"  
                AutoGenerateColumns="false" 
                DataSourceID="SqlDataSource1"  
                OnSelectedIndexChanged="RadGrid1_SelectedIndexChanged" 
                PageSize="8"
                <MasterTableView> 
                    <Columns> 
                        <telerik:GridButtonColumn  
                            Text="Select"  
                            CommandName="Select" /> 
                        <telerik:GridBoundColumn  
                            DataField="CustomerID"  
                            HeaderText="CustomerID"  
                            ReadOnly="True"  
                            SortExpression="CustomerID"  
                            UniqueName="CustomerID"
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn  
                            DataField="CompanyName"  
                            HeaderText="CompanyName"  
                            SortExpression="CompanyName"  
                            UniqueName="CompanyName"
                        </telerik:GridBoundColumn>                   
                    </Columns> 
                </MasterTableView> 
            </telerik:RadGrid> 
             
            <asp:SqlDataSource ID="SqlDataSource1" runat="server"  
                ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"  
                SelectCommand="SELECT [CustomerID], [CompanyName], [Address], [City], [Region], [PostalCode], [Country] FROM [Customers]"
            </asp:SqlDataSource> 
             
        </form> 
    </body> 
    </html> 
     

    Default.aspx.cs
    using System; 
    using Telerik.Web.UI; 
     
    namespace Telerik.Examples 
        public partial class _Default : System.Web.UI.Page 
        { 
            protected void RadGrid1_SelectedIndexChanged(object sender, EventArgs e) 
            {            
                var dataItem = RadGrid1.SelectedItems[0] as GridDataItem; 
                if (dataItem != null
                { 
                    var companyName = dataItem["CompanyName"].Text; 
                    this.LoadUserControl(companyName);   
                } 
            } 
     
            public void LoadUserControl(string data) 
            { 
                var dataControl = this.LoadControl("DataControl.ascx"as Telerik.Examples.DataControl; 
                dataControl.ID = String.Format("DataControl_{0}", data); 
                dataControl.Data = data; 
                Panel1.Controls.Add(dataControl); 
            } 
        } 
     




    I hope this helps. If you have any further questions, please let me know.

    Regards,
    Kevin Babcock
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. f_alonso
    f_alonso avatar
    5 posts
    Member since:
    May 2007

    Posted 17 Nov 2008 Link to this post

    We are working with VS2005, not 2008, so we have some troubles compiling your sample code. The var clause is not recognized by the compiler and the DataControl class can't be instatiated as you show.
  5. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 17 Nov 2008 Link to this post

    Hello f_alonso,

    This syntax can be used under ASP.NET 3.0 or later. Otherwise you can replace the specified line of code with this one:

    MyUserControl dataControl = this.LoadControl("DataControl.ascx"as UserControl; 

    and implement public Data property for your custom user control (MyUserControl) provided that it extends from the UserControl base class.

    Best regards,
    Stephen
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. f_alonso
    f_alonso avatar
    5 posts
    Member since:
    May 2007

    Posted 18 Nov 2008 Link to this post

    Ok.

    Thx.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017