7 Answers, 1 is accepted
0
Hello,
Bozhidar
the Telerik team
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
0
kd
Top achievements
Rank 1
Rank 1
answered on 23 Dec 2011, 12:23 PM
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
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
0
Accepted
Hello,
All the best,
Bozhidar
the Telerik team
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); }}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
0
Harikrishna
Top achievements
Rank 1
Rank 1
answered on 02 May 2013, 07:20 AM
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);
}
}
}
}
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);
}
}
}
}
0
Hi Harikrishna,
You have to put the AsyncUpload inside the UpdatePanel. Like so:
All the best,
Bozhidar
the Telerik team
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.
0
MR
Top achievements
Rank 1
Rank 1
answered on 16 May 2014, 08:45 PM
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?
The upload process will be used my users at the same time. What if they have the same file name?
0
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
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.