Question

我有一个工作模式窗口将实体保存到数据库，我的问题是如何从模态发送文件？

这是我目前的JavaScript函数：

$('#btn-save').on('click', function () {
    $.ajax({
        url: '@Url.Action("CreateModal", "Suggestions")',
        type: 'POST',
        data: $('#modal-form').serialize(),
        success: function (data) {
            if (data.success == true) {
                $('#suggestion-modal').modal('hide');
                location.reload(true);
            } else {
                $('.modal-content').html(data);
                $('#suggestion-modal').modal('show');
            }
        }
    });
});

此部分不发送数据，但在不使用模态和使用标准MVC创建模板时工作正常：

<form id="modal-form" method="post" enctype="multipart/form-data">
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    @Html.HiddenFor(model => model.UserId)

    <div>
        @Html.LabelFor(model => model.Title)
        @Html.EditorFor(model => model.Title)
        @Html.ValidationMessageFor(model => model.Title, "")
    </div>
    <div>
        @Html.LabelFor(model => model.Images, "Images")
        <input type="file" name="upload" multiple />
    </div>
    <div>
        <input id="btn-save" type="button" value="" />
    </div>

</form>

由于一切正常，我已将部分视图的其余部分留下了。

编辑：刚添加我的按钮在表单中的位置。就在那里，我刚刚删除了与问题无关的大部分代码 - 应该已经离开了按钮。还添加了额外的模型属性 - 这些必须与文件一起发送，包括验证令牌。

编辑：非常感谢Jasen。我已将下面的JavaScript包含在其他任何正在努力解决此问题的人手中。

$('#btn-save').on('click', function () {

    var formData = new FormData($('form').get(0));

    $.ajax({
        url: '@Url.Action("CreateModal", "Suggestions")',
        type: 'POST',
        processData: false,
        contentType: false,
        data: formData,
        success: function (data) {
            if (data.success == true) {
                $('#suggestion-modal').modal('hide');
                location.reload(true);
            } else {
                $('.modal-content').html(data);
                $('#suggestion-modal').modal('show');
            }
        }
    });
});

如何使用模态窗口和MVC

0 个答案: