MVC HttpPostedFileBase始终为null,带有ajax选项

时间:2015-11-16 11:56:03

标签: c# asp.net-mvc-3 asp.net-mvc-4

我遇到了一些问题,我无法使用ajaxOptions从表单中获取文件。以下是代码..

@using (Ajax.BeginForm(null, null, new AjaxOptions { OnBegin = "blockUI", OnSuccess = "handleFormSuccess", OnFailure = "onAjaxFailure" }, new { enctype = "multipart/form-data" }))
{
<div class="col-md-4">
                            <div class="form-group">
                                @Html.LabelFor(model => model.MediaName, new { @class = "control-label" })
                                <span class="text-danger" aria-required="true"> * </span>
                                @Html.TextBoxFor(model => model.MediaName, new { @class = "form-control", @placeholder = LocalizationViewModel.Media.MediaName })
                                <span class="text-danger">@Html.ValidationMessageFor(model => model.MediaName)</span>
                            </div>
                        </div>
<div class="row col-md-12">
                        <div id="imageContent" class="form-group">
                            @Html.Label(@LocalizationViewModel.Media.Image, new { @class = "control-label" })
                            <div class="col-md-12">
                                @Html.TextBoxFor(model => model.MediaFile, new { type = "file" })
                            </div>
                        </div>
                    </div>
    }

如果我改为这个,那就是工作文件。

@using (Html.BeginForm("CreateMedia", "Media", FormMethod.Post, new { @class = "form-horizontal", enctype = "multipart/form-data" }))
{
<div class="col-md-4">
                            <div class="form-group">
                                @Html.LabelFor(model => model.MediaName, new { @class = "control-label" })
                                <span class="text-danger" aria-required="true"> * </span>
                                @Html.TextBoxFor(model => model.MediaName, new { @class = "form-control", @placeholder = LocalizationViewModel.Media.MediaName })
                                <span class="text-danger">@Html.ValidationMessageFor(model => model.MediaName)</span>
                            </div>
                        </div>
        <div id="imageContent" class="form-group">
                            @Html.Label(@LocalizationViewModel.Media.Image, new { @class = "control-label" })
                            <div class="col-md-12">
                                @Html.TextBoxFor(model => model.MediaFile, new { type = "file" })
                            </div>
                        </div>
                    </div>
}

下面是我的控制器和视图模型。

[HttpPost]
        [ValidateAntiForgeryToken]
        public async Task<ActionResult> CreateMedia(CreateMediaViewModel viewModel)
        { // some code here
}


public class CreateMediaViewModel
    {
[Display(ResourceType = typeof(Media), Name = "MediaName")]
        [Required(ErrorMessageResourceType = typeof(Message), ErrorMessageResourceName = "MessageFieldRequired")]
        public string MediaName { get; set; }

        [Display(ResourceType = typeof(Media), Name = "Image")]
        public HttpPostedFileBase MediaFile { get; set; }
    }

有没有人有想法让它有效? :(我被困在这里一段时间......谢谢..

2 个答案:

答案 0 :(得分:0)

在第二种情况下,您明确声明了操作和控制器的名称:

Html.BeginForm("Edit", "ClientProgrammeProduct",...

尝试使用Ajax.BeginForm(而不是使用 null )。

请看这里:How to do a ASP.NET MVC Ajax form post with multipart/form-data?

答案 1 :(得分:0)

我在脚本部分添加了此代码,现在可以在控制器上的HttpPostedFileBase参数上检测到文件。

<script>
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);
</script>