Drag and drop works only once

5 posts, 1 answers
  1. Atn
    Atn avatar
    4 posts
    Member since:
    Nov 2011

    Posted 31 Oct 2012 Link to this post

    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)
  2. Plamen
    Admin
    Plamen avatar
    2731 posts

    Posted 01 Nov 2012 Link to this post

    Hi,

     
    I have tried to reproduce the same behavior on our on-line demo but to no avail. Here is  video of my test. Would you please review it and let me know what else should I do or add in order to observe the same error?

    Greetings,
    Plamen
    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. Atn
    Atn avatar
    4 posts
    Member since:
    Nov 2011

    Posted 01 Nov 2012 Link to this post

    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>
     
    <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
  5. Answer
    Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 02 Nov 2012 Link to this post

    Hello Ant,

    I tested the provided code and reproduced the problem. The issue is resolved and the fix will be available in the next internal build. In order to avoid the javascript exception please set UploadedFilesRendering to  "AboveFileInput".
    In a way of gratitude for pointing this out I updated your telerik points.

    Regards,
    Peter Filipov
    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. Atn
    Atn avatar
    4 posts
    Member since:
    Nov 2011

    Posted 02 Nov 2012 Link to this post

    Thank you, that solved my problem. I prefered how it looked when the file uploads were rendered below the file input, but I can live with that.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017