Hello
I'm building a photo cropper that loads an editor via html5 filereader. The editor is loaded via a radAsyncUploader set to manual upload. When the user finishes cropping they click upload, and the radAsyncUploader hits my custom handler.
That all is working fine - however, I can't for the life of me get the server side FileUploaded event to work. Here's my control markup:
Server side I have this:
I have tried subscribing to FileUploaded in Page_Load, as well as triggering a postpack in the client-side RadAsyncUpload1_FileUploaded
handler. Nothing so far has worked. Appreciate any help on this!
update: I modified a sample project you guys provided showing implementation. The event fired when using a custom handler as soon as the upload button was clicked. However, the handler fires as soon as the file is selected. I therefore changed manual upload to true and added an upload button click event handler to start the upload. In this setup, the handler runs when the upload button is clicked (this is what I need to happen), but the fileUploaded event never fires.
here's the page code:
Thanks,
Michael
I'm building a photo cropper that loads an editor via html5 filereader. The editor is loaded via a radAsyncUploader set to manual upload. When the user finishes cropping they click upload, and the radAsyncUploader hits my custom handler.
That all is working fine - however, I can't for the life of me get the server side FileUploaded event to work. Here's my control markup:
<div class="buttons"> <div> <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" OnClientFileDropped="RadAsyncUpload1_FileDropped" OnClientFileSelected="RadAsyncUpload1_FileSelected" OnClientFilesSelected="" HideFileInput="True" Width="221px" HttpHandlerUrl="~/CustomHandlers/CropImage.ashx" ManualUpload="True" OnClientFileUploaded="RadAsyncUpload1_FileUploaded" OnClientFileUploading="RadAsyncUpload1_FileUploading" EnableInlineProgress="True" DisableChunkUpload="True" CssClass="radButton" DropZones="#generated" OnClientFileUploadRemoved="RadAsyncUpload1_FileUploadRemoved" Skin="Default"></telerik:RadAsyncUpload> </div> <div > <input ID="UploadButton" class="upload-file" type="button" value="Upload" onclick="startUpload()"/></div> <div style="clear: both"> </div>protected void Page_Load(object sender, EventArgs e){ RadAsyncUpload1.PostbackTriggers = new string[] { "UploadButton" };}protected void RadAsyncUpload1_FileUploaded(object sender, FileUploadedEventArgs e){ //nothing yet!}handler. Nothing so far has worked. Appreciate any help on this!
update: I modified a sample project you guys provided showing implementation. The event fired when using a custom handler as soon as the upload button was clicked. However, the handler fires as soon as the file is selected. I therefore changed manual upload to true and added an upload button click event handler to start the upload. In this setup, the handler runs when the upload button is clicked (this is what I need to happen), but the fileUploaded event never fires.
here's the page code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %><%@ Register Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" TagPrefix="telerik" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title></title></head><body> <form runat="server"> <script type="text/javascript"> </script> <telerik:RadScriptManager ID="ScriptManager1" runat="server" /> <telerik:RadAsyncUpload ID="radAsyncUpload" runat="server" EnableInlineProgress="true" OnFileUploaded="RadAsyncUpload1_FileUploaded" MaxFileInputsCount="1" OnClientFileUploaded="onClientFileUploaded" OnClientFileUploadRemoved="onClientFileUploadRemoved" PostbackTriggers="radUpload" HttpHandlerUrl="~/CustomHandler.ashx" DisableChunkUpload="True" ManualUpload="True" OnClientFilesSelected="onClientFileSelected" /> <telerik:RadButton ID="radUpload" runat="server" Text="Upload" Enabled="false" CausesValidation="false" OnClientClicked="radUpload_Clicked" /> <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"> <script type="text/javascript"> function onClientFileUploaded(sender, args) { var radUpload = $find("<%=radUpload.ClientID %>"); radUpload.set_enabled(true); } function onClientFileUploadRemoved(sender, args) { var radUpload = $find("<%=radUpload.ClientID %>"); radUpload.set_enabled(false); } function onClientFileSelected(sender, args) { var radUpload = $find("<%=radUpload.ClientID %>"); radUpload.set_enabled(true); } function radUpload_Clicked(sender,args) { var upload = $find('<%=radAsyncUpload.ClientID%>'); upload.startUpload(); } </script> </telerik:RadScriptBlock> </form></body></html>Thanks,
Michael
1 Answer, 1 is accepted
0
Hello Michael,
Having the current logic that you implemented it is expected that the OnFileUploaded event does not fire. This is due to the fact that the file needs to be uploaded on the first place in order for the server-side event to fire. In your scenario however, you perform both postback with the button (whose id is
Regards,
Kate
Telerik
Having the current logic that you implemented it is expected that the OnFileUploaded event does not fire. This is due to the fact that the file needs to be uploaded on the first place in order for the server-side event to fire. In your scenario however, you perform both postback with the button (whose id is
radUpload) and at the same time start uploading the file (you set the ManualUpload to true) which is causing the issue in your case. One approach that you can use is to to set the ManualUpload property to false and implement the needed logic in the OnFileUploaded event. Regards,
Kate
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.