如何在ASP.NET MVC中使用表单上载图像

时间:2018-09-23 13:50:29

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

我知道那里有很多教程,但是我无法理解它们,因为它们只是在发布代码时解释不佳,加上HttpPostedFileBase破坏了我的项目,因为我将其添加到我的模型类项目中后就停止使用erorr :

  

值不能为空。

     

参数名称:entitySet

。我想向我的电影模型添加外键以创建图像,并创建新的模型图像并通过它添加图片。

电影模型:

public class Movie
{
    public int Id { get; set; }

    [Required]
    public string Name { get; set; }
    public Genre Genre { get; set; }
    [Display(Name = "Genre")]
    public int GenreId { get; set; }
    [Required]
    public DateTime DateAdded { get; set; }
    [Required]
    [Display(Name = "Release Date")]
    public DateTime DateReleased { get; set; }
    [Required]
    [Display(Name = "Number in Stock")]
    [Range(1, 20)]
    public int Stock { get; set; }
    public int? ImageId { get; set; }
    public Image ImageModel { get; set; }
}

图片模型:

public class Image
{
    public int Id { get; set; }
    [Required]
    public string UrlOfImage { get; set; }
}

电影保存控制器:

public ActionResult Save(Movie movie)
{
    if (ModelState.IsValid)
    {
        if (movie.Id == 0)
        {
            movie.DateAdded = DateTime.Now;
            _context.Movies.Add(movie);
        }
        else
        {
            var movieInDb = _context.Movies.Single(m => m.Id == movie.Id);
            movieInDb.Name = movie.Name;
            movieInDb.GenreId = movie.GenreId;
            movieInDb.Stock = movie.Stock;
            movieInDb.DateReleased = movie.DateReleased;
        }

        _context.SaveChanges();

        return RedirectToAction("Index", "Movies");
    }

    var viewModel = new NewMovieViewModel(movie)
    {
        Genres = _context.Genres.ToList()
    };
    ModelState.Clear();
    return View("MovieForm", viewModel);
}

NewMovieViewModel

public class NewMovieViewModel
{
    public IEnumerable<Genre> Genres { get; set; }

    public int? Id { get; set; }

    [Required]
    [StringLength(255)]
    public string Name { get; set; }

    [Display(Name = "Genre")]
    [Required]
    public int? GenreId { get; set; }

    [Display(Name = "Release Date")]
    [Required]
    public DateTime? DateReleased { get; set; }

    [Display(Name = "Number in Stock")]
    [Range(1, 20)]
    [Required]
    public int? Stock { get; set; }

    public int? ImageId { get; set; }
    public Image Image { get; set; }
    public string Title
    {
        get
        {
            return Id != 0 ? "Edit Movie" : "New Movie";
        }
    }

    public NewMovieViewModel()
    {
        Id = 0;
    }

    public NewMovieViewModel(Movie movie)
    {
        Id = movie.Id;
        Name = movie.Name;
        DateReleased = movie.DateReleased;
        Stock = movie.Stock;
        GenreId = movie.GenreId;
        ImageId = movie.ImageId;
    }
}

3 个答案:

答案 0 :(得分:0)

该想法是将您的Blob数据分别保存在某些Blob存储中,并且该调用应该是异步的。这将是完全独立的调用,可能是针对特定的Blob容器。

您的页面是管理员页面还是面向用户页面都没有关系。为了提供良好的用户体验,您要么希望在用户选择容器中的图像后立即上传图像,然后取回要保存在元数据表中的URL。

或者您可以允许首先保存所有数据,然后指导用户更新/添加记录中的图像。

您还需要仔细考虑如何批量保存数据(普通数据和Blob数据)。在移动设备的情况下,执行这些相同操作的更好方法是什么?顺便说一下,今天我们应该始终首先从移动客户端的角度来思考。

希望这会有所帮助。

答案 1 :(得分:0)

您应该在方法中定义参数HttpPostedFileBase

public Action Save(Movie movie, HttpPostedFileBase image)

在您看来,您应该输入名称为“ image”的输入

<input type="file" name="image"  />

答案 2 :(得分:0)

您可以尝试一下。

您的视图应如下所示:

mpg:  21.25

您的控制器应如下所示:

@using(Html.BeginForm("UploadFile","Upload", FormMethod.Post, new { 
 enctype="multipart/form-data"}))  
{ 
<div>  
    @Html.TextBox("file", "", new {  type= "file"}) <br />  

    <input type="submit" value="Upload" />  

    @ViewBag.Message  

</div>      
}