RadAsyncUpload Dynamically-Created

8 posts, 0 answers
  1. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 03 Feb 2014 Link to this post

    Can someone provide code for using the AsyncUpload control in an ASP web page built entirely at runtime?  NO aspx/ashx.  All CS, except the master page, which is about 5 levels up from my user control.  I can't get past a bunch of Javascript errors - likely related to the httpHandlers section, but I can't find a definitive configuration doc for that, either.

    The need is simple: drop a user control down that will allow uploads (and thus backend processing of uploaded files) without performing a full postback on the page.  

    Thanks,
    JD
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 04 Feb 2014 in reply to JD Link to this post

    Hi,

    Please have a look into the sample code snippet which works fine at my end.

    ASPX:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Upload">
    </telerik:RadButton>
    <telerik:RadButton ID="RadButton2" runat="server" Text="PostBack">
    </telerik:RadButton>

    C#:
    RadAsyncUpload upload = new RadAsyncUpload();
    protected void Page_Load(object sender, EventArgs e)
    {
        upload.ID = "Upload1";
        upload.FileUploaded += new FileUploadedEventHandler(upload_FileUploaded);
        this.form1.Controls.Add(upload);
        RadAjaxManager1.AjaxSettings.AddAjaxSetting(RadButton1, upload, null);
    }
    void upload_FileUploaded(object sender, FileUploadedEventArgs e)
    {
      //your code
    }

    Let me know if you have any concern.
    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 04 Feb 2014 in reply to Shinu Link to this post

    Shinu,

    Thanks for the quick response.  The sample code does include an aspx, which I don't have, but I modified it to create all the objects dynamically and I get the following error at the AddAjaxSetting(...) call:

    Value cannot be null.
    Parameter name: page

    Ideas?
    JD

  5. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 04 Feb 2014 in reply to Shinu Link to this post

    Here is the code.
    FileUpload.aspx:
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="fileUpload.aspx.cs" Inherits="TelerikApp.filter" %>
     
    <!DOCTYPE html>
     
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
         
        </div>
        </form>
    </body>
    </html>


    FileUpload.aspx.cs:
    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using TelerikApp.Controls;
     
    namespace TelerikApp
    {
        public partial class fileUpload : System.Web.UI.Page
        {
            protected WebControl _DivPageContent = new WebControl(HtmlTextWriterTag.Div);
            protected void Page_Load(object sender, EventArgs e)
            {
                AddFrameWorkContent(new filterSimpleCtrl());
                AddFrameWorkContent(new UploadControl());
                this.Controls.Add(_DivPageContent);
            }
     
            public void AddFrameWorkContent(object obj)
            {
                this._DivPageContent.Controls.Add((Control)obj);
            }
        }
    }

    Now UploadControl.cs:
    using System;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace TelerikApp.Controls
    {
        public class UploadControl : WebControl
        {
            private Button _btUpload = new Button();
            private RadAsyncUpload _fiInput = new RadAsyncUpload();
            private DropDownList _DdDocumentTypes = null;
            private RadAjaxManager _ajaxManager = null;
     
     
            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);
     
                this._ajaxManager = new RadAjaxManager();
                this._ajaxManager.ID = "_ajaxManager";
                this.Controls.Add(this._ajaxManager);
     
                this._DdDocumentTypes = new DropDownList();
                this._DdDocumentTypes.ID = "DDLDocumentTypes";
                this._DdDocumentTypes.EnableViewState = false;
                this._DdDocumentTypes.AutoPostBack = false;
                this._DdDocumentTypes.Items.Add(new ListItem("type1"));
                this._DdDocumentTypes.Items.Add(new ListItem("type2"));
     
                this._fiInput.ID = "FileInput";
                this._fiInput.MultipleFileSelection = Telerik.Web.UI.AsyncUpload.MultipleFileSelection.Disabled;
                this._fiInput.FileUploaded += FileUploaded;
                _ajaxManager.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput);
     
                this._btUpload.ID = "UploadButton";
                //this._btUpload.Command += new System.Web.UI.WebControls.CommandEventHandler(Upload_Command);
                this._btUpload.CausesValidation = false;
                this._btUpload.Text = "Upload";
     
                DataBind();
     
                this.Controls.Add(this._DdDocumentTypes);
                this.Controls.Add(this._fiInput);
                this.Controls.Add(this._btUpload);
            }
     
            private void FileUploaded(object sender, FileUploadedEventArgs e)
            {
     
            }
     
        }
     
    }







  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 04 Feb 2014 in reply to JD Link to this post

    Hi,

    Please have a look into the sample code snippet to achieve your scenario.

    C#(Fileupload.aspx) :
    protected void Page_Init(object sender, EventArgs e)
    {
        Control mynewcontrol = new Control();
        mynewcontrol = LoadControl("UploadControl.ascx");
        this.form1.Controls.Add(mynewcontrol);
        RadAjaxManager manager = new RadAjaxManager();
        manager.ID = "RadAjaxManager1";
        this.form1.Controls.Add(manager);
    }

    UploadControl.ascx:
    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="UploadControl.ascx.cs" Inherits="RadAsyncUpload_UploadControl" %>
     
    <asp:ScriptManager ID="s1" runat="server">
    </asp:ScriptManager>

    C#(UploadControl .ascx):
    RadAjaxManagerProxy managerproxy = new RadAjaxManagerProxy();
    RadAsyncUpload upload = new RadAsyncUpload();
    RadButton button = new RadButton();
    protected void Page_Init(object sender, EventArgs e)
    {
        managerproxy.ID = "RadAjaxManagerProxy1";
        this.Controls.Add(managerproxy);
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        button.ID = "Button1";
        button.Text = "Upload";
        upload.ID = "Upload1";
        upload.FileUploaded += new FileUploadedEventHandler(upload_FileUploaded);
        this.Controls.Add(button);
        this.Controls.Add(upload);
        managerproxy.AjaxSettings.AddAjaxSetting(button, upload);
    }
    void upload_FileUploaded(object sender, FileUploadedEventArgs e)
    {
        //your code
    }

    Hope this will helps you.
    Thanks,
    Shinu.
  7. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 05 Feb 2014 in reply to Shinu Link to this post

    Shinu,

    I apologize for being unclear - I mentioned "ashx" in the original post and I meant "ascx".  Let me try to be a bit more clear in my dilemma:  I don't have ANY markup in the user control.  It's just a .cs file, no markup, all dynamic.  Furthermore, I don't have access to alter the consumer, which in my example is the FileUpload.aspx page; I only know that it does have a "master" form embedded in it, and I can get at the form's control set if needed, using Page.FindControl("form1").  So ALL the code for implementation of the Async upload functionality needs to be contained in the fileUpload.cs - thus the control and all its widgets are created "dynamically".  

    Again, I did my best to try to implement your new example that way, but end up with the same null reference error when calling managerproxy.AjaxSettings.AddAjaxSetting(...).   

    Thanks again and looking forward to your reply,
    Justyn

    Latest Version of UploadControl.cs:
    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace TelerikApp.Controls
    {
        public class UploadControl : WebControl
        {
            private Button _btUpload = new Button();
            private RadAsyncUpload _fiInput = new RadAsyncUpload();
            private DropDownList _DdDocumentTypes = null;
            private RadAjaxManager _ajaxManager = null;
            RadAjaxManagerProxy managerproxy = new RadAjaxManagerProxy();
     
     
     
            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);
                managerproxy.ID = "RadAjaxManagerProxy1";
                this.Controls.Add(managerproxy);
     
     
                ScriptManager scriptManager = new ScriptManager();
                scriptManager.ID = "scriptManager";
                this.Controls.Add(scriptManager);
            }
            protected override void OnLoad(EventArgs e)
            {
                base.OnLoad(e);  
     
                this._ajaxManager = new RadAjaxManager();
                this._ajaxManager.ID = "_ajaxManager";
                //this.Controls.Add(this._ajaxManager);
                this.Page.FindControl("form1").Controls.Add(this._ajaxManager);
     
                this._DdDocumentTypes = new DropDownList();
                this._DdDocumentTypes.ID = "DDLDocumentTypes";
                this._DdDocumentTypes.EnableViewState = false;
                this._DdDocumentTypes.AutoPostBack = false;
                this._DdDocumentTypes.Items.Add(new ListItem("type1"));
                this._DdDocumentTypes.Items.Add(new ListItem("type2"));
     
                this._fiInput.ID = "FileInput";
                this._fiInput.MultipleFileSelection = Telerik.Web.UI.AsyncUpload.MultipleFileSelection.Disabled;
                this._fiInput.FileUploaded += FileUploaded;
                //_ajaxManager.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput);
     
                this._btUpload.ID = "UploadButton";
                //this._btUpload.Command += new System.Web.UI.WebControls.CommandEventHandler(Upload_Command);
                this._btUpload.CausesValidation = false;
                this._btUpload.Text = "Upload";
     
                DataBind();
     
     
                this.Controls.Add(this._DdDocumentTypes);
                this.Controls.Add(this._fiInput);
                this.Controls.Add(this._btUpload);
                managerproxy.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput);
            }
     
            private void FileUploaded(object sender, FileUploadedEventArgs e)
            {
     
            }
     
        }
     
    }


  8. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 06 Feb 2014 Link to this post

    Shinu, 
    I've cleaned up the code and now am REALLY close.  You will see several lines commented with "switch" - when those are reversed to where the RadAjaxManager is in the .aspx file everything works (but this isn't an option for me).  If I do the same thing inside the .cs file (which is what I have to do since I don't have access to the .aspx), I get the null reference error.  Basically I need a way to attach the AjaxManager from the UserControl, not from the .aspx.

    We are ALMOST in business!  Thanks for sticking with this issue.

    fileUpload.aspx:
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="fileUpload.aspx.cs" Inherits="TelerikApp.fileUpload" %>
     
    <!DOCTYPE html>
     
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
         
        </div>
        </form>
    </body>
    </html>


    fileUpload.aspx.cs:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
    using TelerikApp.Controls;
     
    namespace TelerikApp
    {
        public partial class fileUpload : System.Web.UI.Page
        {
            protected WebControl _DivPageContent = new WebControl(HtmlTextWriterTag.Div);
     
            protected void Page_Init(object sender, EventArgs e)
            {
     
                AddFrameWorkContent(new UploadControl());
                _DivPageContent.ID = "_DivPageContent";
                this.form1.Controls.Add(_DivPageContent);
     
                //RadAjaxManager manager = new RadAjaxManager();  //switch
                //manager.ID = "RadAjaxManager1";                 //switch
                //this.form1.Controls.Add(manager);               //switch
            }
     
            public void AddFrameWorkContent(object obj)
            {
                this._DivPageContent.Controls.Add((Control)obj);
            }
        }
    }

    UploadControl.cs:
    using System;
    using System.Threading;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace TelerikApp.Controls
    {
        public class UploadControl : WebControl
        {
            private RadButton _btUpload = new RadButton();
            private RadAsyncUpload _fiInput = new RadAsyncUpload();
            private DropDownList _DdDocumentTypes = null;
            private Label _lbl = new Label();
            private RadAjaxManagerProxy managerproxy = new RadAjaxManagerProxy();
            private RadAjaxManager _ajaxManager = new RadAjaxManager();
     
     
            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);
     
                this._ajaxManager.ID = "_ajaxManager";                              //switch
                this.Page.FindControl("form1").Controls.Add(this._ajaxManager);     //switch
     
                managerproxy.ID = "RadAjaxManagerProxy1";
                this.Controls.Add(managerproxy);
     
                ScriptManager scriptManager = new ScriptManager();
                scriptManager.ID = "scriptManager";
                this.Controls.Add(scriptManager);
            }
     
            protected override void OnLoad(EventArgs e)
            {
                base.OnLoad(e);  
     
                this._lbl.ID = "_lbl";
                this._lbl.Text = "Nothing";
     
                this._DdDocumentTypes = new DropDownList();
                this._DdDocumentTypes.ID = "DDLDocumentTypes";
                this._DdDocumentTypes.EnableViewState = false;
                this._DdDocumentTypes.AutoPostBack = false;
                this._DdDocumentTypes.Items.Add(new ListItem("type1"));
                this._DdDocumentTypes.Items.Add(new ListItem("type2"));
     
                this._fiInput.ID = "FileInput";
                this._fiInput.MultipleFileSelection = Telerik.Web.UI.AsyncUpload.MultipleFileSelection.Disabled;
                this._fiInput.FileUploaded += FileUploaded;
     
                this._btUpload.ID = "UploadButton";
                this._btUpload.CausesValidation = false;
                this._btUpload.Text = "Upload";
     
                DataBind();
     
                this.Controls.Add(this._DdDocumentTypes);
                this.Controls.Add(this._fiInput);
                this.Controls.Add(this._btUpload);
                this.Controls.Add(this._lbl);
                managerproxy.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput);  //error!
                managerproxy.AjaxSettings.AddAjaxSetting(_btUpload, _lbl);
                //_ajaxManager.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput); //error!
            }
     
            private void FileUploaded(object sender, FileUploadedEventArgs e)
            {
                Thread.Sleep(2000);
                _lbl.Text = "Uploaded " + e.File.FileName + " type: " + this._DdDocumentTypes.SelectedValue;
            }
     
        }
     
    }
  9. JD
    JD avatar
    22 posts
    Member since:
    Jul 2013

    Posted 06 Feb 2014 Link to this post

    Mission Accomplished!  The issue boiled down to the ScriptManager not being declared BEFORE the RadAjaxManager.  Thanks for all your help, Shinu!  This is now a working example of Async uploading (partial postback only) in a dynamically-created user control.

    Here is the final version of UploadControl.cs.  The other files have not changed.
    using System;
    using System.Threading;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace TelerikApp.Controls
    {
        public class UploadControl : WebControl
        {
            private RadButton _btUpload = new RadButton();
            private RadAsyncUpload _fiInput = new RadAsyncUpload();
            private DropDownList _DdDocumentTypes = null;
            private Label _lbl = new Label();
            private RadAjaxManager _ajaxManager = new RadAjaxManager();
     
            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);
     
                ScriptManager scriptManager = new ScriptManager();
                scriptManager.ID = "scriptManager";
                this.Page.Form.Controls.Add(scriptManager);
     
                this._ajaxManager.ID = "_ajaxManager";          
                this.Page.Form.Controls.Add(this._ajaxManager);     
     
                this._lbl.ID = "_lbl";
                this._lbl.Text = "Nothing";
     
                this._DdDocumentTypes = new DropDownList();
                this._DdDocumentTypes.ID = "DDLDocumentTypes";
                this._DdDocumentTypes.EnableViewState = false;
                this._DdDocumentTypes.AutoPostBack = false;
                this._DdDocumentTypes.Items.Add(new ListItem("type1"));
                this._DdDocumentTypes.Items.Add(new ListItem("type2"));
     
                this._fiInput.ID = "FileInput";
                this._fiInput.MultipleFileSelection = Telerik.Web.UI.AsyncUpload.MultipleFileSelection.Disabled;
                this._fiInput.FileUploaded += FileUploaded;
     
                this._btUpload.ID = "UploadButton";
                this._btUpload.CausesValidation = false;
                this._btUpload.Text = "Upload";
     
                DataBind();
     
                this.Controls.Add(this._DdDocumentTypes);
                this.Controls.Add(this._fiInput);
                this.Controls.Add(this._btUpload);
                this.Controls.Add(this._lbl);
     
            }
     
            protected override void OnPreRender(EventArgs e)
            {
                base.OnPreRender(e);
     
                _ajaxManager.AjaxSettings.AddAjaxSetting(_btUpload, _fiInput);
                _ajaxManager.AjaxSettings.AddAjaxSetting(_btUpload, _lbl);
     
            }
     
            private void FileUploaded(object sender, FileUploadedEventArgs e)
            {
                Thread.Sleep(2000);
                _lbl.Text = "Uploaded " + e.File.FileName + " type: " + this._DdDocumentTypes.SelectedValue;
            }
     
        }
     
    }
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017