Uploading files with no postback at all

2 posts, 0 answers
  1. John
    John avatar
    6 posts
    Member since:
    May 2012

    Posted 25 Sep 2013 Link to this post

    I am not sure that I totally understand the way that the radasyncupload control works. What I am trying to do is to have a page that lets users upload files, but there can be no postbacks at all on that page. Everything else that happens on the page uses ajax calls to an API on the server.
    Is it possible to do what I am trying to do? I can see that the files are getting uploaded to the temp folder on the server, but the final part of the process where the uploaded event fires doesn't happen until a postback occurs.

  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 27 Sep 2013 Link to this post

    Hi John,

    It is possible to upload file without making a postback as create a Custom Handler, which overrides the default AsyncUpload's handler. This way when file is selected it will be transfer to the handler where you can save it where you want.
    <script type="text/javascript">
        function OnClientFileUploadFailed(sender, args) {
     
        }
     
        function OnClientValidationFailed(sender, args) {
            $('#failure').slideToggle();
        }
     
        function OnClientFilesUploaded(sender, args) {
            $('#success').slideToggle();
        }
    </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
        <telerik:RadAsyncUpload
            ID="RadAsyncUpload1"
            OnClientFileUploadFailed="OnClientFileUploadFailed"
            OnClientValidationFailed="OnClientValidationFailed"
            OnClientFilesUploaded="OnClientFilesUploaded"
            HttpHandlerUrl="~/Handler.ashx"
            TargetFolder="~/Uploads"
            runat="server">
        </telerik:RadAsyncUpload>
        <div id="success">
            File was uploaded successfully.
        </div>
        <div id="failure">
            Error!
        </div>
    </div>

    public class Handler : AsyncUploadHandler, System.Web.SessionState.IRequiresSessionState
    {
        protected override IAsyncUploadResult Process(UploadedFile file, HttpContext context, IAsyncUploadConfiguration configuration, string tempFileName)
        {
            string targetFolder = context.Server.MapPath("~/Uploads/");
            string fileName = file.GetName();
             
            file.SaveAs(targetFolder + fileName);
                
            return CreateDefaultUploadResult<UploadedFileInfo>(file);
        }
    }

    Sample is attached.

    Regards,
    Hristo Valyavicharski
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top