asp.net - c#MVC3 ajax.beginform 上传文件不起作用

Question

点击提交按钮后。我在实体中得到空值。 有人有解决方案吗？

看法

    @using (Ajax.BeginForm("CreateRoom", "Room", new AjaxOptions { HttpMethod = "POST", OnComplete = "window.location.href='Index'" }, new { enctype = "multipart/form-data", id = "ajaxUploadForm" }))
    {
        <input type="file" name="Room" />
        <input type="submit" value="OK" />
    }

控制器

    [HttpPost]
    public ActionResult CreateRoom(RoomFileView entity)
    {
        //code
    }

模型

     public class RoomFileView
    {
        public RoomFileView();

        public int BuildingId { get; set; }
        public int CityId { get; set; }
        public int CountryId { get; set; }
        public int FloorId { get; set; }
        public int LocationId { get; set; }
        public HttpPostedFileWrapper Room { get; set; }

        public string Content();
    }

Answer 1

我写了一个小技巧。它在大多数浏览器中都能正常工作，但 IE 不支持 FormData 对象。您可以将此代码添加到您的自定义 js 文件或 html 页面。

window.addEventListener("submit", function (e) {
    var form = e.target;
    if (form.getAttribute("enctype") === "multipart/form-data") {
        if (form.dataset.ajax) {
            e.preventDefault();
            e.stopImmediatePropagation();
            var xhr = new XMLHttpRequest();
            xhr.open(form.method, form.action);
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    if (form.dataset.ajaxUpdate) {
                        var updateTarget = document.querySelector(form.dataset.ajaxUpdate);
                        if (updateTarget) {
                            updateTarget.innerHTML = xhr.responseText;
                        } 
                    }
                }
            };
            xhr.send(new FormData(form));
        }
    }
}, true);

Answer 2

您不能使用 AJAX 上传文件。使用正常的 Html.BeginForm。请查看此链接单击此处，因为这将对您有所帮助。

如果您想使用异步上传，您可以尝试一些可用的上传组件，例如 Ajax Upload 和 Uploadify。

Answer 3

您不能使用 AJAX.Beginform 上传文件。
有许多第三方 js 控件可用。
但我觉得它们没有多大用处。
您必须使用<iframe>或使用 Html.Beginform

Answer 4

不幸的是，您不能使用 Ajax.BeginForm() 来上传文件。我通过在提交事件上运行 onclick() 事件来解决这个问题。我发现这个 SO 答案非常有用：Ajax.BeginForm 没有按预期工作

Answer 5

window.addEventListener("submit", function (e) {
var form = e.target;
if (form.getAttribute("enctype") === "multipart/form-data") {
    if (form.dataset.ajax) {
        e.preventDefault();
        e.stopImmediatePropagation();
        var xhr = new XMLHttpRequest();
        xhr.open(form.method, form.action);
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                if (form.dataset.ajaxUpdate) {
                    var updateTarget = document.querySelector(form.dataset.ajaxUpdate);
                    if (updateTarget) {
                        updateTarget.innerHTML = xhr.responseText;
                    } 
                }
            }
        };
        xhr.send(new FormData(form));
    }
}}, true);