This is a migrated thread and some comments may be shown as answers.

Drag and drop works only once

4 Answers 169 Views

AsyncUpload

This is a migrated thread and some comments may be shown as answers.

Atn asked on 31 Oct 2012, 07:04 PM

Hello,

I am using the RadAsyncUpload control to upload filesd to our website. Everything works fine except the drag and drop upload. I can manually add as many files as I want by clicking on the button, but I can only add one file trough drag and drop either trough the control itself or the drop zone. Any subsequent attempts to add a file by dropping it results in a "Uncaught TypeError: Cannot read property 'input' of undefined" in chrome or a "TypeError: p is undefined" in firebug. I tried playing with the AutoAddFileInputs parameter without success.

right now the tag looks like this :

<telerik:RadAsyncUpload runat="server" ID="rfUpload" Width="225px"



DropZones

="#DropZone" MultipleFileSelection="Automatic" AutoAddFileInputs="true"



OnClientAdded

="fiad" OnClientFileUploadRemoved="fiad" OnClientFileUploaded="fiup"
UploadedFilesRendering="BelowFileInput" />

and I can drag and drop several files at once but not one after the other.

I use Visual Studio 2012, RadControls Q3 2012, Windows 8 and .net framework 4.0 and we mainly use VB ( a C# solution would be fine since I'm fluent in both)

4 Answers, 1 is accepted

answered on 01 Nov 2012, 02:34 PM

I also was unable to reproduce the issue using the online demos, however, here's a screencast i made reproducing it. Here's the markup I used followed by the code behind (it didn't include the events since they're not needed to reproduce the issue)

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="test.aspx.vb" Inherits="CentralCollab.test" %>

<%@ 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="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" language="javascript">

function fiad(y, z) {

$('td[name="trBtnUpl"]').hide()

}

function fiup(y, z) {

$('td[name="trBtnUpl"]').show()

}

</script>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="asm" runat="server" EnableScriptGlobalization="true" ScriptMode="Debug" EnableScriptLocalization="true" EnablePartialRendering="true" />

<div>

<table>

<tr>

<td>

<div id="DropZone" class="DropZone ui-corner-all" style="background-color:aliceblue; width: 225px; height: 161px; display: block; z-index: 10000;">

</div>

<br />

<telerik:RadAsyncUpload runat="server" ID="rfUpload" Width="225px" DropZones="#DropZone" MultipleFileSelection="Automatic" AutoAddFileInputs="true"

OnClientAdded="fiad" OnClientFileUploadRemoved="fiad" OnClientFileUploaded="fiup" UploadedFilesRendering="BelowFileInput" />

</td>

</tr>

<tr>

<td style="display: none;" name="trBtnUpl">

<asp:Button ID="btnUpload" runat="server" Text="Upload" CssClass="active" />

</td>

</tr>

</table>

</div>

</form>

</body>

</html>

Public Class test

Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

End Sub

End Class

Accepted

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Drag and drop works only once

4 Answers, 1 is accepted