События Dropzone не запускаются и перенаправляются на другую страницу

Question

Я пытаюсь загрузить dropzone в модальном окне.До сих пор, когда я открываю модальное окно, я могу выбирать свои файлы с помощью поля dropzone.Тем не менее, когда я отправляю, ни одно из моих событий, которые были настроены в JavaScript, не запускается.Вместо этого приложение по какой-то причине перенаправляет меня на домашнюю страницу.

Я попытался установить точку останова в коде отправки на сервере, чтобы увидеть, сработает ли он, но это не так.

Я не уверен, как еще я могу настроить dropzone для работы с модальным окном и формой.

Это код моего модального окна, которое содержит dropzone:

@model AppOne.Data.ViewModels.AnnouncementAttachmentDetailsViewModel
<script src="~/dropzone/dropzone.js"></script>
<script>
    $(document).ready(function () {
        console.log("loaded");
    });
    Dropzone.autoDiscover = false;
    var mDz = new Dropzone("#dropzone",{
    url: "@Url.Action("Save", "AnnouncementAttachments", new { area = "Messages" })",
    autoProcessQueue: false,
    addRemoveLinks: true,
    maxFiles: 1,
    init: function () {
            var submitButton = document.querySelector("#submit");
            var token = $('input[name="__RequestVerificationToken"]').val();
            var wrapperThis = this;
            submitButton.addEventListener("click", function (e) {
                console.log("submitted");
                wrapperThis.processQueue();
                e.preventDefault();
                e.stopPropagation();
                e.stopImmediatePropagation();
                return false;
            });

            this.on('sendingmultiple', function (data, xhr, formData) {
                formData.append("__RequestVerificationToken", token);
                formData.append("@Html.IdFor(x=>x.AnnouncementId)",$("#@Html.IdFor(x => x.AnnouncementId)").val())
            });;

            this.on('errormultiple', function (file, message) {
                //toastr.error(message);
                wrapperThis.disable();
            });

            this.on('successmultiple', function (file,message) {
                $.each(message, function (key, value) {
                    //toastr.success(value);
                });
                $(".dz-remove").hide();
                wrapperThis.disable();
            });
        }
    });

</script>

<div class="row row-extend">
    <div class="col-sm-12">
        <h2>Upload</h2>
    </div>
    <div class="col-sm-12">
        <hr />
    </div>
</div>
@using (Html.BeginForm(null, null, FormMethod.Post, new { @action = "/", enctype = "multipart/form-data", id = "modal" }))
{
    @Html.AntiForgeryToken()
    <div class="col-sm-12">
        <div class="row">
            <div class="col-sm-12">
                <div class="form-group">
                    @Html.HiddenFor(x => x.AnnouncementId)
                    <div id="dropzone" name="Files" class="dropzone form-group"></div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <hr />
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <div class="form-group">
                    <div class="clearfix">
                        <div class="pull-right">
                            <button type="submit" id="submit" class="btn btn-primary">Upload</button>
                            @Html.ActionLink("Cancel", "Index", @ViewContext.RouteData.Values["controller"].ToString(), new { }, new { @class = "btn btn-outline-secondary" })
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
}