将类型文件中的数据发送到 ASP.NET MVC 中的控制器

Question

我想发送一张照片来发布博客！

我在我的模型中定义了两个属性。一个是要存储在数据库中的照片名称，另一个是获取文件并保存到服务器（在资源文件夹中）。

这是我的模型代码：

[DataType(DataType.Upload)]
public HttpPostedFileBase File { get; set; }

public string BlogImage { get; set; }

这是我的 HTML 代码：

<div class="form-group col-sm-8">
                    <label for="BlogImage">Blog Image</label>
                    <input type="file" class="form-control" id="BlogImage">
                </div>

我想通过 AJAX 将文件发送到服务器。

 var myAdminBlog = {
    BlogImage: $("#BlogImage").val(),
    File: $("#BlogImage").val()
};

$.ajax({
    url: 'AddPostBlog',
    data: JSON.stringify(myAdminBlog),
    type: "POST",
    contentType: "application/json;charset=utf-8",
    dataType: "json",
    success: function (data) {
        alert(data);
    },
    error: function (errormessage) {
        alert(errormessage);
    }
});

这是我的 Ajax 代码。

终于可以看到控制器代码了。

 public JsonResult AddPostBlog(csAdminBlog myAdminBlog)
    { 
       int UploadMessage = UploadImage(myAdminBlog);
       return Json("Post Sended", JsonRequestBehavior.AllowGet);

    }

我的问题正是我不知道如何从 javascript 中获取文件。

我尝试使用 $("#BlogImage").val() 方法，但失败了。

注意：所有代码都运行良好，所有信息都发送到控制器，只有没有发送的项目是文件选项

Answer 1

如果不需要在jQuery中，那么你可以使用document.getElementById(BlogImage).files[0]

像这样创建类

Public Class UploadFile
{
[DataType(DataType.Upload)]
public HttpPostedFileBase File { get; set; }

public string BlogImage { get; set; }

}

然后在javascript中

 var UploadFile= new Object();
 UploadFile.BlogImage = $("#BlogImage").val();
 UploadFile.File = document.getElementById(BlogImage).files[0];

$.ajax({
   url: 'AddPostBlog',
   data: JSON.stringify({uploadFile:UploadFile}),
   type: "POST",
   contentType: "application/json;charset=utf-8",
   dataType: "json",
   success: function (data) {
      alert(data);
   },
   error: function (errormessage) {
      alert(errormessage);
   }

});

在控制器方法中

 public JsonResult AddPostBlog(UploadFile uploadFile)
 { 
  //Your Code

}