Question

我正在开发基于MVC / Razor的应用程序我试图在jquery模式对话框内的视图中设置文件上传

这是我的观看代码

@using (Html.BeginForm("<MyAction>", "<MyController>", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div>
        <input type="file" id="UploadImage" name="UploadImage" style="width:705px;" />
    </div>
    <div>
        <input id="sbmt" type="submit" value="Save" />
    </div>
}

但是当我接到我的控制器动作时，Request.Files.Count总是0

public ActionResult MyAction(Model model){
     ...
}

我在这里缺少什么？

由于

Answer 1

通过将表单数据显式添加到Ajax Post，我能够在JQuery模式对话框（MVC）中执行文件上载：

Javascript代码：

     // Checking whether FormData is available in browser  
                if (window.FormData !== undefined) {
                    var fileUpload = $("#fileInput").get(0);
                    var files = fileUpload.files;

                    // Create FormData object  
                    var fileData = new FormData();

                    // Looping over all files and add it to FormData object  
                    for (var i = 0; i < files.length; i++) {
                        fileData.append(files[i].name, files[i]);
                    }

                    // Adding additional parameters to FormData object  

                    fileData.append('name', $('#nameinput').val());  
                    fileData.append('uniqueID', $('#hiddenFieldUniqueID').val());  


                $.ajax({
                    type: 'POST',
                    contentType: false,
                    processData: false,
                    url: '@Url.Action("UploadFile", "YourController")',
                    data: fileData, 
                    success: function (returnValues) {
                        $('.ui-dialog-buttonpane').unblock();
                        if (returnValues["success"] ==  true) {
                            bootbox.alert(returnValues["feedback"]);
                            $(dlg).dialog("close");
                        }
                        else {
                            bootbox.alert(returnValues["feedback"]);
                        }
                    },
                    error: function (returnValue) {
                        $('.ui-dialog-buttonpane').unblock();
                        debugger;
                        bootbox.alert({ message: "Oops - Error Occured!" + returnValue, size: 'small' });
                    }
                    });
                }
                else {
                    bootbox.alert("Your browser doesnt support the method we are using to upload files (FormData is not supported)");
                }

HTML（无需表格标签）：

<div class="col-md-9">
                <label class="btn btn-primary" for="fileInput">
                    <input id="fileInput" type="file" style="display:none"
                           onchange="$('#upload-file-info').html(this.files[0].name)">
                    Select
                </label>
                <span class='label label-info' id="upload-file-info"></span>
            </div>

控制器：

      [HttpPost]
    public ActionResult UploadFile()
    {
        YourObjectFile yourObjectFile = null;
        try
        {
            string name = Request.Form["name"];
            if (Request.Files.Count > 0)
            {
                yourObjectFile = new YourObjectFile ();
                HttpPostedFileBase file = Request.Files[0];

                if (file != null && file.ContentLength > 0)
                {
                    string fileName = file.FileName;
                    using (var reader = new System.IO.BinaryReader(file.InputStream))
                    {
                        yourObjectFile.RawData = reader.ReadBytes(file.ContentLength);
                    }
                }
            }                
    .......

这种方法的功劳属于：http://www.c-sharpcorner.com/UploadFile/manas1/upload-files-through-jquery-ajax-in-Asp-Net-mvc/

MVC 4在jquery模式对话框窗口中上传文件

1 个答案: