File Select box pops up repeatedly

6 posts, 0 answers
  1. John
    John avatar
    5 posts
    Member since:
    Aug 2014

    Posted 17 Aug 2015 Link to this post

    When my users select a file to upload, the File Select box closes then immediately re-opens again for each previously selected file.  For example, if I select one file, it works fine.  When a second file is selected, the file select box closes, but then opens again with the name of the first file selected.  If I select a third file, the File Select box opens twice more, once for each of the previously selected files.

    In my implementation, I display the selected files myself and then trigger the upload after the files are selected.  The upload of the selected files works fine.  Any ideas??

    My RadAsyncUpload control is defined this way:

    <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" style="display:none;" MultipleFileSelection="Disabled" Skin="Silk" TargetFolder="uploads" HideFileInput="true" ManualUpload="true" EnableInlineProgress="false" OnClientFileSelected="RadUpload_OnClientFileSelected" OnClientFilesUploaded="RadUpload_OnClientFilesUploaded" OnClientFileUploaded="RadUpload_OnClientSingleFileUploaded" OnClientFileUploading ="RadUpload_OnClientFileUploading" OnClientFileUploadFailed="RadUpload_OnUploadFailed" OnClientValidationFailed ="RadUpload_OnClientValidationFailed" UploadedFilesRendering="BelowFileInput" HttpHandlerUrl="~/Handler.ashx" DisablePlugins="true" OnClientFileUploadRemoving="RadUpload_FileRemoving">


    I start the selection by clicking a button which calls this javascript function:

    function RadUpload_StartSelection(sender, args) {

       $telerik.$(".ruFileInput").click();

    }

    function RadUpload_OnClientFileSelected(sender, args) {

    //fired for each file that was selected. We add the file to our list

    //with a "[X]" link to remove it (which calls RadUpload_removeFile)

    $telerik.$(args.get_row()).addClass("ruUploading"); //adding this css class to the row prevents it from displaying under the control

    //now add the filename and [X] anchor to our file list

    var $List = $("#divFileList");

    if ($List.html().length>0) $List.html($List.html()+" + ");

    $List.html($List.html()+args.get_fileName()+" <a href='#' id='" + args.get_row()._mapIndex + "' onclick='RadUpload_removeFile(this);return false;'>[X]</a>");

    }


     
     
     
  2. John
    John avatar
    5 posts
    Member since:
    Aug 2014

    Posted 17 Aug 2015 in reply to John Link to this post

    Note that this only happens when the ManualUpload property is set to true (I need to defer the upload until I trigger the startUpload() event).
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ivan Danchev
    Admin
    Ivan Danchev avatar
    835 posts

    Posted 20 Aug 2015 Link to this post

    Hello,

    I am afraid I was not able to reproduce the issue with the provided code and the file selection was working correctly at my side. I am attaching a sample runnable web site based on your code. Please try to reproduce the issue in it and post your modifications, so we can further test your scenario and try to determine the cause for the observed behavior.

    Regards,
    Ivan Danchev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. John
    John avatar
    5 posts
    Member since:
    Aug 2014

    Posted 20 Aug 2015 in reply to Ivan Danchev Link to this post

    Thank you for your help Ivan.  I can make your project duplicate my problem by simply adding a separate button to trigger the select (instead of using the button created by the control).  Add this:

    <input type="button" id="btnSelectFiles" value="Click to Select Files" onclick="RadUpload_StartSelection();" />

    Note1: the RadUpload_StartSelection() function used by this button is already on your ManualUpload.aspx page

    Note2: I also hide the RadAsyncUpload control by adding Style="display:none;" to the control, but this is not necessary to duplicate the problem.

    Click the new button to trigger the File Select -- it will work fine for the first file but will display the file-select box twice for the second file and three times for a third, etc.

     

    Many thanks for your help!

     
     
     
  6. Ivan Danchev
    Admin
    Ivan Danchev avatar
    835 posts

    Posted 21 Aug 2015 Link to this post

    Hello,

    Thank you for the provided additional information, it helped reproduce the issue with the consecutive opening dialog windows. We will need more time to analyze this behavior and determine what causes it. I will get back to you as soon as we have any result.

    Regards,
    Ivan Danchev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  7. Ivan Danchev
    Admin
    Ivan Danchev avatar
    835 posts

    Posted 24 Aug 2015 Link to this post

    Hello,

    After further analysis of your scenario we found out that the cause for the observed behavior is calling click() on multiple input elements. When a file is selected an input element with class "ruFileInput" is rendered and with multiple files selected the input elements' count increases accordingly. So in order to prevent multiple click events from firing your code can be modified as shown below, which will ensure that only the first element will be clicked:
    function RadUpload_StartSelection() {
        $telerik.$(".ruFileInput").first().click();
    }

    Regards,
    Ivan Danchev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017