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

Implement File Upload

2 Answers 485 Views
Upload
This is a migrated thread and some comments may be shown as answers.
Anieda Hom
Top achievements
Rank 1
Anieda Hom asked on 04 Sep 2018, 09:01 PM

I try to use drag and drop/select from file folder to upload multiple files.  It does not act the way as your demo does.  It can not select multiple files.  It can not drag and drop.  The drag and drop region does not show.   

Here is the code in the Upload.cshtml page:

@using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data", id = "form" }))
{
 <div class="form-input">
  <div>
   The Upload can be used as a drop-in replacement
   for file input elements.
  </div>
  <div>
   @(Html.Kendo().Upload()
   .Name("attchments")
   .Async(a => a
    .Save("Upload", "Home")
    .Remove("RemoveUpload", "Home")
    .AutoUpload(true))                
   ))
  </div>
  <p style="padding-top: 1em; text-align: right">
   <button type="submit" class="k-button k-primary">Submit</button>
  </p>
 </div>
}

In _Layout.cshtml page, I have the following links:

<link href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2018.1.221/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2018.1.221/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2018.1.221/kendo.default.mobile.min.css")" rel="stylesheet" type="text/css" />
<link href="https://kendo.cdn.telerik.com/2018.1.221/styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<script src="https://kendo.cdn.telerik.com/2018.1.221/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.1.221/js/kendo.all.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.1.221/js/kendo.aspnetmvc.min.js"></script>
<script src="@Url.Content("~/Scripts/kendo/2018.1.221/jszip.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>

 

What do I missed?  

Thanks in advance for your help!

Anieda

 

2 Answers, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 07 Sep 2018, 05:35 AM
Hello Anieda,

Attached you will find a small MVC sample based on the snippets sent. One change, that I have made is to remove the duplicate reference to the kendo.common.min.css file. Also, I have referenced all Kendo scripts and styles from our CDN service.

You will notice that the attached sample works as expected. Upon drag and drop files they are being uploaded to the server. Note, that in this case the Upload widget in in its asynchronous mode. That means it will no need a form to be placed on for uploading the files. It will upload the files straight away with an AJAX after they have been selected.

Can you modify the attached, so it reproduces the problem observed at your end and send it back to us? This way we will be able to troubleshoot the problem locally and to provide you with the most appropriate assistance on this case.

Regards,
Veselin Tsvetanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Anieda Hom
Top achievements
Rank 1
answered on 11 Sep 2018, 03:21 PM

Veselin,

Thanks for your response.  I'll try out your sample.  Will send you questions if I encounter issues.

Many thanks,

Anieda

 

 

 

 

Tags
Upload
Asked by
Anieda Hom
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Anieda Hom
Top achievements
Rank 1
Share this question
or