RadAsyncUpload list of files form serverside

8 posts, 1 answers
  1. kd
    kd avatar
    23 posts
    Member since:
    Dec 2011

    Posted 23 Dec 2011 Link to this post

    Hi All,
    i am new one for telerik RadControlls Q2010 for .Net v.4.0  how can i upload multiple file on specific folders when i am clicking on save button can any one send me sample code

    Thanks
  2. Bozhidar
    Admin
    Bozhidar avatar
    1102 posts

    Posted 23 Dec 2011 Link to this post

    Hello,

    The RadAsyncUpload has an event called OnFileUploaded. If fires for every uploaded file, and you can get the uploaded file there and save it in a specified folder, depending on the file extesnion for instance. You can read more about this event in the following help article.

    Greetings,
    Bozhidar
    the Telerik team
    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 their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. kd
    kd avatar
    23 posts
    Member since:
    Dec 2011

    Posted 23 Dec 2011 Link to this post

    thanks for rpl .
    i am using RadAsyncUpload and i have set MultipleFileSelection property is Automatic if i create an event RadAsyncUpload1_FileUploaded for file storing in specific folder each time this event will be called when user click on  browse button and
    one thing more if user cancel or remove any file which is shown on browser after browsed by user how can i remove such file from my folder ?

    Is there any way to i want to store all uploaded list of file on an other button clicks
  5. Answer
    Bozhidar
    Admin
    Bozhidar avatar
    1102 posts

    Posted 26 Dec 2011 Link to this post

    Hello,

    The FileUploaded event doesn't fire when you hit the browse button. It fires for each file, when the file is already uploaded to the handler and after a postback occurs (for instance a button click).

    You can also get the uploaded files inside the button click event, without the FileUploaded event. Just use the RadAsyncUpload's UploadedFiles property.

    Here is an example on how you can save all the files in a folder called "Files" in the ButtonClicked event:

    protected void Button1_Click(object sender, EventArgs e)
    {
        foreach (UploadedFile file in RadAsyncUpload1.UploadedFiles)
        {
            string path = Server.MapPath("Files/");
            file.SaveAs(path + file.FileName);
        }
    }
    All the best,
    Bozhidar
    the Telerik team
    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 their blog feed now
  6. Harikrishna
    Harikrishna avatar
    8 posts
    Member since:
    Sep 2012

    Posted 02 May 2013 Link to this post

    Hi Bozhidar,

    I have written the above same code in code behiind. First time i dropeed some files to drozone that files successfully sotred in Uploads Folder. after am dropping another files then its getting error. Find the attachment for error.
    Please send me the solution.

    My code is :

    WebForm1.aspx
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

    <!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="Scripts/jQuery/jquery.min.js" type="text/javascript"></script>
        <script src="Scripts/highslide/highslide-full.packed.js" type="text/javascript"></script>
        <script src="Scripts/highslide/highslide-full.packed.using.js" type="text/javascript"></script>
        <link href="Scripts/highslide/highslide.css" rel="stylesheet" type="text/css" />
        <link href="Scripts/highslide/highslide-ie6.css" rel="stylesheet" type="text/css" />
        <link href="Styles/css.css" rel="stylesheet" type="text/css" />
         <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
                    <script type="text/javascript">

                        function DeleteFile(filePath) {
                            $.ajax({
                                type: 'POST',
                                contentType: "application/json; charset=utf-8",
                                dataType: 'json',
                                url: '/WebForm1.aspx/DeleteFile',
                                data: "{'filePath': \"" + filePath + "\"}",
                                success: function (data) {
                                    if (data.d) {
                                        alert('Delete file successfully');
                                    } else {
                                        //alert(data.d);
                                        alert('Cannot delete file');
                                    }
                                }
                            });
                        }

                        function onFilesUploaded(sender, args) {
                            $('#btnUpload').click();
    }

                        function onFileUploadRemoving(sender, args) {
                            DeleteFile("/Uploads/" + args.get_fileName());
                        }
                    </script>
                </telerik:RadCodeBlock>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:ScriptManager runat="server" ID="ScriptManager1">
                </asp:ScriptManager>
                <asp:UpdatePanel runat="server" ID="UpdatePanel1">
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="btnUpload" />
                    </Triggers>
                    <ContentTemplate>
                        <asp:Button runat="server" ID="btnUpload" UseSubmitBehavior="false" ClientIDMode="Static"
                            OnClick="btnUpload_Click" Style="display: none;" />
                    </ContentTemplate>
                </asp:UpdatePanel>
                <h2>Auto uploading image and display thumbnails with HighSlide
                </h2>
                <p>
                    <telerik:RadAsyncUpload runat="server" ID="txtImage" OnClientFilesUploaded="onFilesUploaded"
                        MaxFileInputsCount="10" MultipleFileSelection="Automatic" OnClientFileUploadRemoving="onFileUploadRemoving" DropZones=".DropZone1,#DropZone2" TemporaryFolder="TempFiles"
                        AllowedFileExtensions="jpg,png,jpeg,gif,txt"> <%--AllowedFileExtensions="jpg,png,jpeg,gif--%> 
                    </telerik:RadAsyncUpload>
                </p>

               
            </div>

            <<div class="DropZone1">
                <p>Custom Drop Zone</p>
                <p>Drop Files Here</p>
            </div>
            <div id="DropZone2">
                <p>Custom Drop Zone</p>
                <p>Drop Files Here</p>
            </div>
        </form>
    </body>
    </html>

    WebForm1.aspx.cs
    ---------------------------
    using System;
    using System.Collections.Generic;
    using System.IO;
    using System.Linq;
    using System.Web;
    using System.Web.Services;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;

    namespace WebApplication1
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            [WebMethod]
            public static bool DeleteFile(string filePath)
            {
                try
                {
                    if (File.Exists(HttpContext.Current.Server.MapPath(filePath)))
                    {
                        File.Delete(HttpContext.Current.Server.MapPath(filePath));
                        return true;
                    }
                    return false;
                }
                catch
                {
                    return false;
                }
            }
            protected void Page_Load(object sender, EventArgs e)
            {
                //if (IsPostBack)
                    //txtImage.UploadedFiles.Clear();
            }
            protected void btnUpload_Click(object sender, EventArgs e)
            {
                foreach (UploadedFile file in txtImage.UploadedFiles)
                {
                    string path = Server.MapPath("Uploads/");
                    file.SaveAs(path + file.FileName);
                }
            }
        }
    }
  7. Bozhidar
    Admin
    Bozhidar avatar
    1102 posts

    Posted 06 May 2013 Link to this post

    Hi Harikrishna,

    You have to put the AsyncUpload inside the UpdatePanel. Like so:
    <asp:UpdatePanel runat="server" ID="UpdatePanel1">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnUpload" />
        </Triggers>
        <ContentTemplate>
            <asp:Button runat="server" ID="btnUpload" UseSubmitBehavior="false" ClientIDMode="Static"
                OnClick="btnUpload_Click" Style="display: none;" />
            <telerik:RadAsyncUpload runat="server" ID="txtImage" OnClientFilesUploaded="onFilesUploaded"
                MaxFileInputsCount="10" MultipleFileSelection="Automatic"
                OnClientFileUploadRemoving="onFileUploadRemoving" DropZones=".DropZone1,#DropZone2"
                AllowedFileExtensions="jpg,png,jpeg,gif,txt"> <%--AllowedFileExtensions="jpg,png,jpeg,gif--%>
            </telerik:RadAsyncUpload>
        </ContentTemplate>
    </asp:UpdatePanel>

     

    All the best,
    Bozhidar
    the Telerik team
    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 their blog feed now.
  8. MR
    MR avatar
    20 posts
    Member since:
    Dec 2011

    Posted 16 May 2014 in reply to Bozhidar Link to this post

    This will be my first time using the  RadAsyncUpload. It looks like the control first uploads the file to a temp folder but how does the control which request the file belong to when I want to upload to a different location for SharePoint from a click of another button.

    The upload process will be used my users at the same time. What if they have the same file name?


  9. Bozhidar
    Admin
    Bozhidar avatar
    1102 posts

    Posted 21 May 2014 Link to this post

    Hi Yassin,

    The files in the temp folder have a GUID number added to their name to prevent naming conflicts, so you shouldn't experience any issues. If you do however, please open a support ticket with detailed information about your setup, so that we can do our best to resolve the issue.

    Regards,
    Bozhidar
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

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