Ajax Request with window inside usercontrol

2 posts, 0 answers
  1. Mo
    Mo avatar
    5 posts
    Member since:
    Aug 2006

    Posted 08 Feb 2010 Link to this post

    hello, i can't seem to get this working correctly.  Maybe you'll have more insight on this problem.
    I have a user control which contains a button,label,and radwindow.  I then programmatically add this usercontrol to the main page.  I run the page and click on the button (which is set to open the window).  I have placed the javascript functions inside the usercontrol to call the ajax requests.  My goal is to make an ajax postback when the window opens, and another one when the window closes.  This all works fine when i'm not using a usercontrol and all the controls are placed within the main page,  But, when I place the controls inside the usercontrol, only the first ajax request triggers, and everything afterwards doesn't get called.
    I have attached a simple scenerio which should help show you what i'm trying to accomplish:
    1) usercontrol (ascx): contains a button, label, radwindow, and ajaxmanager (along with the js functions to call the requests)
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
           <script type="text/javascript"
               function onClose() { 
                   $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("closed"); 
               } 
               function onOpen() { 
                   $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("opened"); 
               } 
           </script> 
       </telerik:RadCodeBlock> 
     
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"  
        onajaxrequest="RadAjaxManager1_AjaxRequest"
        <AjaxSettings> 
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1"
                <UpdatedControls> 
                    <telerik:AjaxUpdatedControl ControlID="Label1" /> 
                </UpdatedControls> 
            </telerik:AjaxSetting> 
        </AjaxSettings> 
    </telerik:RadAjaxManager> 
            
            <telerik:RadWindow ID="RadWindow1" runat="server" 
            OpenerElementID="<%# Button1.ClientID %>"  
            OnClientClose="onClose" OnClientShow="onOpen" 
            > 
             
            </telerik:RadWindow> 
            <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
            <asp:Button ID="Button1" runat="server" Text="Button" /> 
     

    2) usercontrol (.cs):
    using System; 
    using System.Collections.Generic; 
    using System.Linq; 
    using System.Web; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
     
    public partial class WebUserControl : System.Web.UI.UserControl 
        protected void Page_Load(object sender, EventArgs e) 
        { 
     
        } 
     
        protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e) 
        { 
            switch (e.Argument) 
            { 
                case "closed"
                    Label1.Text = "Closed"
                    break
                case "opened"
                    Label1.Text = "Opened"
                    break
            } 
        } 
     
    2) main aspx/cs page (with MasterPage): programmatically loads the usercontrol onto the content page.
    Content Page (aspx): 
    <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
    <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"
    </asp:Content> 
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"
    <asp:PlaceHolder ID="holder" runat="server"></asp:PlaceHolder> 
    </asp:Content> 
     
    Content Page (.cs): 
    using System; 
    using System.Collections.Generic; 
    using System.Linq; 
    using System.Web; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
     
    public partial class _Default : System.Web.UI.Page 
        protected void Page_Load(object sender, EventArgs e) 
        { 
            Control ucControl = LoadControl("~/WebUserControl.ascx"); 
            ucControl.ID = "MyUserControl"
            holder.Controls.Add(ucControl); 
        } 

    What I've been trying to accomplish:
    When I open the window, that should trigger an ajax request (which works).  And, when I close the window, that should trigger another ajax request (doesn't work).  I am passing arguments as well.  For simplicity, I've placed a label that outputs if the window has been opened or closed.  I actually just want to rebind a list when the window closes.  It seems to only work for the first ajax request, and not any more afterwards.

    Thanks for your help,
  2. Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 11 Feb 2010 Link to this post

    Hello Mo,

    When a user control is loaded dynamically and RadAjaxManager is added to it, in order to maneger to be initialized properly you need to create it dynamically on Page_Init of the user control.
    Therefore I suggest that you modify your code as below and see if it works for you:

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">  
    <script type="text/javascript">  
        function onClose() {  
            $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest("closed");  
        }  
        function onOpen() {  
            $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest("opened");  
        }  
    </script>  
    </telerik:RadCodeBlock>
      
    <telerik:RadWindow ID="RadWindow1" runat="server"  
        OpenerElementID="<%# Button1.ClientID %>"   
        OnClientClose="onClose" OnClientShow="onOpen">  
    </telerik:RadWindow>  
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>  
    <asp:Button ID="Button1" runat="server" Text="Button" />

    public partial class WebUserControl : System.Web.UI.UserControl  
    {  
        protected void Page_Init(object sender, EventArgs e)  
        {  
            RadAjaxManager manager = new RadAjaxManager();
            manager.ID = "RadAjaxManager1";
            manager.AjaxRequest += new RadAjaxControl.AjaxRequestDelegate(RadAjaxManager1_AjaxRequest);
            this.Page.Form.Controls.Add(manager);
        }  
        protected void Page_Load(object sender, EventArgs e)
        {
            RadAjaxManager manager = RadAjaxManager.GetCurrent(Page);
            manager.AjaxSettings.AddAjaxSetting(manager, Label1);
        
        protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)  
        {  
            switch (e.Argument)  
            {  
                case "closed":  
                    Label1.Text = "Closed";  
                    break;  
                case "opened":  
                    Label1.Text = "Opened";  
                    break;  
            }  
        }  
    }

    Additionally, you can review the below online resources for more information on RadAjax and user controls:

    http://www.telerik.com/help/aspnet-ajax/ajxusercontrols.html
    http://www.telerik.com/help/aspnet-ajax/ajxaddajaxsettingsprogrammatically.html

    Regards,
    Iana
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top