正常形式的ASP.Net Dropzone将文件上传到MVC动作

时间:2016-11-04 22:34:26

标签: c# jquery asp.net-mvc forms dropzone.js

我已经看过并寻找对这种情况的良好反应,但目前似乎找不到任何东西。我想让我的用户将文件上传到dropzone,然后为什么他们点击提交让MVC操作对这些文件执行某些操作(更具体地说,此操作将向附件的联系人发送电子邮件,但稍后会这样)。

问题是我看到的每个教程或修复程序都让我将整个表单设置为dropzone并且我不想这样做。我目前正在使用它,以便当用户将文件拖放到dropzone时,它调用服务器端脚本并将文件保存在临时文件夹中,但理想情况下,当我进入MVC时,我想让流中的文件可用动作。

我希望表单最终看起来像这样,不要将整个表单包装为dropzone -

Dropzone Example

Form Wrapper / Form Jquery:

    let resultArray = someArray.filter((item: any) => {
        return item.hasValue();
    });

表单内容:

@using (Html.BeginForm("Contact", "Partners", FormMethod.Post, new { @class = "smart-form client-form", id = "contact-form", enctype="multipart/form-data" }))
{

    @Html.Partial("_ContactForm")

}

@section pagespecific {

    <!-- PAGE RELATED PLUGIN(S) -->
    <script src="/scripts/plugin/dropzone/dropzone.min.js"></script>

    <script>

        $(document).ready(function () {

            Dropzone.autoDiscover = false;
            $("#dZUpload").dropzone({
                // This is the url I don't want it to go to, I want to go to the MVC Action
                url: "../App_Service/hn_FileUpload.ashx",
                addRemoveLinks: true,
                maxFilesize: 0.5,
                dictDefaultMessage: '<span class="text-center"><span class="font-lg visible-xs-block visible-sm-block visible-lg-block"><span class="font-lg"><i class="fa fa-caret-right text-danger"></i> Drop files <span class="font-xs">to upload</span></span><span>&nbsp&nbsp<h4 class="display-inline"> (Or Click)</h4></span>',
                dictResponseError: 'Error uploading file!',
                success: function (file, response) {
                    var imgName = response;
                    file.previewElement.classList.add("dz-success");
                    console.log("Successfully uploaded :" + imgName);
                },
                error: function (file, response) {
                    file.previewElement.classList.add("dz-error");
                }
            });

        });

    </script>
}

Dropzone Jquery:

0 个答案:

没有答案