Блог

Я пытаюсь загрузить файлы с помощью Dropzone и ASP.Net основной сайт. Код выполняется без ошибок и приводит меня к успешной странице, поэтому я не знаю, что делать. Мой код приведен ниже: HTML:

             <form id="newNotice" class="newNotice" method="post" action="https://localhost:5003/api/Attach" enctype="multipart/form-data">
                <input class="fill-width input" type="text" id="newposttitle" placeholder="Title" required />
                <select id="Cat" class="fill-width input">
                    <option value="">Select what Category this KB article applies to</option>
                    <option value="0">SIMS.Net</option>
                    <option value="1">SEN</option>
                    <option value="2">PC amp; On-site Services</option>
                    <option value="3">Office 365</option>
                    <option value="4">OneDrive amp; SharePoint</option>
                    <option value="5">IT Support</option>
                </select>
                <textarea id="details" class="fill-width" placeholder="Full Details" style="height: 100%;"></textarea>
                <div class="dropzone" id="dropzone">
                    <div class="dropzone-previews"></div>
                </div>
                <input type="submit" style="width: 100%;" value="Save" class="fill-width" onclick="validate()">
            </form>
  

JS:

             Dropzone.options.dropzone = { // The camelized version of the ID of the form element

                // The configuration we've talked about above
                url: "#",
                autoProcessQueue: false,
                uploadMultiple: false,
                parallelUploads: 100,
                maxFiles: 100,
                paramName: "files",
                addRemoveLinks: true,
                // The setting up of the dropzone
                init: function () {
                    var myDropzone = this;
                }
            }
  

Ниже JS используется для обработки очереди:

                             var myDropzone = Dropzone.forElement(".dropzone");
                            myDropzone.processQueue();
  

ASP:

         public async Task<IActionResult> Attach([FromForm]IList<IFormFile> files)
        {
            try
            {
                string absolutepath = _hostEnvironment.WebRootPath;
                Path.Combine(absolutepath, "Attachments");

                foreach (var file in files)
                {
                    try
                    {
                        var uploads = Path.Combine(absolutepath, file.FileName);
                        using (var fileStream = new FileStream(uploads, FileMode.Create))
                        {
                            await file.CopyToAsync(fileStream);
                        }
                        
                    } catch (Exception ex)
                    {
                        return BadRequest(ex.Message);
                    }
                }
                return RedirectToAction("~/results.html");

            }
            catch (Exception exception)
            {
                //  return BadRequest(new { success = false, message = "Error file failed to upload" });
                return BadRequest(exception.Message);
            }
        }
  

Я совершенно не понимаю, почему это не работает. Я не получаю никаких очевидных ошибок относительно того, что может происходить
Любая помощь приветствуется

Насколько я знаю, dropzone автоматически обнаружит элемент формы или связанный с dropzone элемент для создания dropzone div.

Поскольку ваше действие формы установило значение действия, а Dropzone.options также установил URL-адрес, это означает, что оно выдаст ошибку, которая No URL provided ошибка.

Поскольку я не знаю, каковы ваши фактические требования. Если вы не хотите использовать URL-адрес действия формы, вы можете установить его в атрибуте URL-адреса Dropzone.options и отключить этот autoDiscover атрибут.

Более подробную информацию вы можете найти в приведенном ниже примере:

 <form id="newNotice" class="newNotice" method="post" action="https://localhost:44350/api/Attach" enctype="multipart/form-data">
    <input class="fill-width input" type="text" id="newposttitle" placeholder="Title" required />
    <select id="Cat" class="fill-width input">
        <option value="">Select what Category this KB article applies to</option>
        <option value="0">SIMS.Net</option>
        <option value="1">SEN</option>
        <option value="2">PC amp; On-site Services</option>
        <option value="3">Office 365</option>
        <option value="4">OneDrive amp; SharePoint</option>
        <option value="5">IT Support</option>
    </select>
    <textarea id="details" class="fill-width" placeholder="Full Details" style="height: 100%;"></textarea>
    <div class="dropzone" id="dropzone">
        <div class="dropzone-previews"></div>
    </div>

    <input type="button" style="width: 100%;" value="Upload" class="fill-width" onclick="upload()">
    <input type="submit" style="width: 100%;" value="Save" class="fill-width" onclick="validate()">



</form>

<script>
    Dropzone.options.dropzone = { // The camelized version of the ID of the form element

        // The configuration we've talked about above
        url: "https://localhost:44350/api/Attach",
        autoProcessQueue: false,
        uploadMultiple: false,
        autoDiscover : false,
        parallelUploads: 100,
        maxFiles: 100,
        paramName: "files",
        addRemoveLinks: true,
        // The setting up of the dropzone
        init: function () {
            var myDropzone = this;
        }
    }
  

    function upload() {
        var myDropzone = Dropzone.forElement(".dropzone");
        myDropzone.processQueue();
    }
</script>
  

Обратите внимание: я добавляю новую кнопку для запуска метода processQueue.

Результат: