Automatic upload

9 posts, 0 answers
  1. david
    david avatar
    210 posts
    Member since:
    May 2007

    Posted 20 Sep 2015 Link to this post

    Is there a way to automatically upload , both on drag'n'drop and Select file...so users don't have to hit a button and force a post back?

    We do have code behind that processes the files and updates the DB that needs to run

     

    thanks

     

  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 21 Sep 2015 Link to this post

    Hi David,

    There two ways to do that:
    1. Submit the form automatically using the RadAjaxManager:
      <form id="form1" runat="server">
             <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                 <Scripts>
                     <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                     <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                     <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
                 </Scripts>
             </telerik:RadScriptManager>
             <script type="text/javascript">
                 function fileSelected(sender, args) {
                     $find("ajaxManager").ajaxRequest();
                 }
             </script>
             <telerik:RadAjaxManager runat="server" ID="ajaxManager">
                 <AjaxSettings>
                     <telerik:AjaxSetting AjaxControlID="ajaxManager">
                         <UpdatedControls>
                             <telerik:AjaxUpdatedControl ControlID="ajaxManager" />
                             <telerik:AjaxUpdatedControl ControlID="asyncUpload" />
                         </UpdatedControls>
                     </telerik:AjaxSetting>
                 </AjaxSettings>
             </telerik:RadAjaxManager>
             <telerik:RadAsyncUpload runat="server" ID="asyncUpload" OnClientFileSelected="fileSelected" TargetFolder="~/Uploads"></telerik:RadAsyncUpload>
         </form>
    2. Use Custom Http Handler to upload file immediately after it is selected:AsyncUpload - Custom Http Handler


    Regards,
    Hristo Valyavicharski
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. david
    david avatar
    210 posts
    Member since:
    May 2007

    Posted 21 Sep 2015 in reply to Hristo Valyavicharski Link to this post

    Hi Hristo , thank you for your quick and comprehensive reply. When I use the first method, in the page_load event I am checking this:

       if ((IsPostBack) && (RadUpload1.UploadedFiles.Count > 0))
                HandleUpload();

     If I submit the form the Count>0 and life is good; but when the form is submitted automatically via the  $find("ajaxManager").ajaxRequest() the Count is 0 and the processing doesn't fire. Should I be handling this another way?

     

    thank you

  5. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 24 Sep 2015 Link to this post

    Sorry to use OnClientFilesUploaded instead OnClientFileSelected:
    <script type="text/javascript">
          function filesUploaded(sender, args) {
              $find("ajaxManager").ajaxRequest("upload");
          }
      </script>
     
      <telerik:RadAjaxManager runat="server" ID="ajaxManager" OnAjaxRequest="ajaxManager_AjaxRequest">
          <AjaxSettings>
              <telerik:AjaxSetting AjaxControlID="ajaxManager">
                  <UpdatedControls>
                      <telerik:AjaxUpdatedControl ControlID="asyncUpload" />
                  </UpdatedControls>
              </telerik:AjaxSetting>
          </AjaxSettings>
      </telerik:RadAjaxManager>
      <telerik:RadAsyncUpload runat="server" ID="asyncUpload" OnClientFilesUploaded="filesUploaded" TargetFolder="~/Uploads"></telerik:RadAsyncUpload>



    protected void ajaxManager_AjaxRequest(object sender, AjaxRequestEventArgs e)
       {
           if (e.Argument == "upload")
           {
               foreach (UploadedFile file in asyncUpload.UploadedFiles)
               {
                   file.SaveAs(Server.MapPath("~/Uploads/") + file.FileName);
               }
           }
       }


    Regards,
    Hristo Valyavicharski
    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
  6. Lou
    Lou avatar
    61 posts
    Member since:
    Aug 2014

    Posted 31 Mar Link to this post

    Hi Hristo, I have the same requirement to automatically complete the upload. When I tried your suggestion I got an exception when the ajaxManager_AjaxRequest method was called. The file.SaveAs() method threw a file not found exception. I ran the upload again and while looking at the temporary folder location on my machine I saw that the temporary file was removed before the call to ajaxManager_AjaxRequest was made.

    I found that by simply not handling the ajaxManager_AjaxRequest method at all I got the desired results (automatic POST and completion of renaming temporary file to the target file/location).

    I don't fully understand why this is, but thought I'd mention it in case others have the same trouble.

    -Lou

  7. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 05 Apr Link to this post

    Hi,

    Try to remove the TargetFolder="~/Uploads" property.

    Does it help?

    Regards,
    Hristo Valyavicharski
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  8. Lou
    Lou avatar
    61 posts
    Member since:
    Aug 2014

    Posted 05 Apr in reply to Hristo Valyavicharski Link to this post

    Yes, if I remove the TargetFolder property (or set it to "" on the server side) then the code in ajaxManager_AjaxRequest() runs without problems. Presumably because in that case, the temporary file doesn't automatically get renamed to the target location before the call to ajaxManager_AjaxRequest().

    Could you explain why? It would be helpful to understand what is going on under the covers.

    Thanks,

    -Lou

  9. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 06 Apr Link to this post

    When file is selected AsyncUpload automatically uploads it into the Temporary Folder (App_Data\RadUploadTemp). If TargetFolder property is defined and postback occurs then the async will move selected file from temporary to the target folder. However you tries to save it manually through the code. This cause error, because when your code:
    protected void ajaxManager_AjaxRequest(object sender, AjaxRequestEventArgs e)
       {
           if (e.Argument == "upload")
           {
               foreach (UploadedFile file in asyncUpload.UploadedFiles)
               {
                   file.SaveAs(Server.MapPath("~/Uploads/") + file.FileName);
               }
           }
       }

    is executed the file actually doesn't exits it was already saved (moved from temp to target) by the control.

    Regards,
    Hristo Valyavicharski
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  10. Lou
    Lou avatar
    61 posts
    Member since:
    Aug 2014

    Posted 06 Apr in reply to Hristo Valyavicharski Link to this post

    OK - thanks for the explanation!

    -Lou

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017