0

我在 ASP.Net MVC4 中有一个使用 Html 助手的基本表单。我有一个用于上传文件的输入文件，该文件将被添加到数据库中。在我的视图模型中，我有一个输入文件的属性：

        public HttpPostedFileBase AssetFile { get; set; }

在我看来，我有表单助手：

@using (Html.BeginForm("Create", "Contact", FormMethod.Post, new { enctype = "multipart/form-data" }))

在我的表格里面：

@Html.TextBoxFor(model => model.AssetFile, new { @type = "file", @name = "AssetFile" })

然而，当我发布表单时，Request.Files 中没有文件。然后我注意到在 Fiddler 中，请求标头具有 Content-Type: application/x-www-form-urlencoded; 字符集=UTF-8。我有另一个带有输入文件的表单，标题有 Content-Type: multipart/form-data; 边界=----WebKitFormBoundaryCfBFSR0RXQRnasfb，这种形式工作正常。我尝试在没有 Html 助手的情况下这样做，但同样的事情发生了。视图模型本身继承自输入文件实际所属的另一个视图模型，但随后我将一个字符串属性映射到文本框，并且表单正在获取该值。没有嵌套表单（在此页面上，这是唯一的表单），但我在使用包含如下表单的多个部分视图的另一个具有多个表单（非嵌套）的页面时遇到了同样的问题：

@using (Html.BeginForm("Edit", "Home", FormMethod.Post, new { @enctype = "multipart/form-data" })){ @Html.Partial("EditorTemplates/_Profile", Model.InstitutionProfileInformation)}

提前感谢您的帮助。

好的 - 这就是奇怪的地方。由于他们（原始编码员）使用部分视图，因此他们对这件事进行了 ajaxified。当部分视图（带有表单）被渲染时：

    var loadContactDiv = function (e) {
    isChanged = false;
    var url = e.href;
    $("#Contacts").load(url, function (response, status, xhr) {
        if (status == "error") {
            var msg = "Sorry but there was an error: ";
        }

        $("#Contacts").find('form').submit(divSubmitHandler).change(function () {
            isChanged = true;
        });

        $("#ReturnButton").click(function () {
            loadContacts();
        });
    });
    return false;
};

然后当用户点击提交按钮时：

    var divSubmitHandler = function () {
    var form = $("#Contacts").find('form');
    var test = form.serialize();

    debugger;
    $.ajax({
        url: (form).attr('action'),
        data: form.serialize(),
        type: "POST",
        success: function (data) {
            if (data == "") {
                loadContacts();
            } else {
                $("#Contacts").html(data);

                $("#Contacts").find('form').submit(divSubmitHandler).change(function () {
                    isChanged = true;
                });
                $("#ReturnButton").click(function (e) {
                    loadContacts();
                });
            }
        }
    });

    return false;
};

仍然卡住： http: //prntscr.com/20v2cp

4

1 回答 1

1

由于您不是提交表单，而是使用$.ajax远程处理请求然后获取结果，因此 enctype 会从表单本身中被忽略。

您还可以看到表单数据被序列化并发送。

所以这里的修复很简单，要正确提交内容类型，只需添加一个

内容类型

像这样的ajax请求选项，

var divSubmitHandler = function () {
    var form = $("#Contacts").find('form');
    var test = form.serialize();

    debugger;
    $.ajax({
        url: (form).attr('action'),
        **contentType: 'multipart/form-data',**
        data: form.serialize(),
        type: "POST",
        success: function (data) {
            if (data == "") {
                loadContacts();
            } else {
                $("#Contacts").html(data);

                $("#Contacts").find('form').submit(divSubmitHandler).change(function () {
                    isChanged = true;
                });
                $("#ReturnButton").click(function (e) {
                    loadContacts();
                });
            }
        }
    });

    return false;
};

这应该可以解决问题。但是如果它不起作用，请参考 Jquery Form Ajax submit。

jQuery AJAX 提交表单

有一个愉快的会议！

于 2013-10-31T04:12:13.757 回答