MVC 갤러리 갤러리에서 이미지 선택

Question

사용자가 이미지를 선택하고 추가 정보를 추가 할 수있게하려고합니다.

I 추가 정보를 보유하고 객체가이 - 그냥 간단하게하고 두 문자열을 말할 수 - 그리고 이미지

[Table("ImageInfo")] 
public class ImageInfo 
{ 
    [Key] 
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)] 
    public int ImageInfoId { get; set; } 
    public string Name { get; set; } 
    public string Description { get; set; } 

    public Image Image { get; set; } 
} 

[Table("Image")] 
public class Image 
{ 
    [Key] 
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)] 
    public int IamgeId { get; set; } 
    public byte[] ImageBytes { get; set; } 
} 

들어 나는 사용자에게 두 개의 텍스트 필드를 표시 할 뷰를 작성하고 'gallary'타입의 레이아웃.

iamge gallary 부분을 부분보기로하여 다른 곳에서도 다시 사용할 수 있기를 바랍니다.

이미지를 표시하고 컨트롤러에서 어떤 이미지를 사용하여 컨트롤러를 연결했는지 확인할 수있는 방법을 알 수 없습니다. 나는 특정 모델을보기 위해 이미지를 필요로 할 것이지만 그 이상의 것을 비워야한다.

누군가 올바른 방향으로 나를 가리킬 수 있습니까?

ps. ImageInfo와 Image를 별도의 테이블에 저장하는 이유는 각 Image에 대해 많은 ImageInfo가 존재한다는 것입니다.

Answer 1

예. 특정보기 특정 모델이 필요합니다. ViewModels라고 부릅니다. 이것들은 View에서 사용되는 간단한 POCO 클래스입니다. 우리 시나리오를 위해 2 가지를 생성 해 봅시다.

public class AddUserImageViewModel 
{ 
    public int UserId { set;get;} 
    public List<ImageViewModel> AvailableImages { set;get;} 
    public string Name { set;get;} 
    public string Description { set;get;} 
    public int SelectedImageID { set;get;} 
}  
public class ImageViewModel 
{ 
    public int ID { set;get;} 
    public string Name { set;get;} 
    public string Description { set;get;} 
    public string URL { set;get;} 
} 

는 이제 GET 행동,

public ActionResult AddImage() 
{ 
    var vm=new AddUserImageViewModel(); 
    vm.AvailableImages =repositary.GetAvailableImages(); 
    return View(vm); 
} 

지금 우리의보기가 강력하게 우리의 뷰 모델에 입력됩니다 우리의 ViewModel의 객체에 속성 값을 설정을

@model AddUserImageViewModel 
<h2>Add image to profile</h2> 
@using(Html.Beginform()) 
{ 
    @Html.HiddenFor(m=>m.SelectedImageID) 
    <input type="submit" /> 
} 
@{ Html.RenderPartial("AvailableImages",Model.AvailableImages); } 

AvailableImages이 될 것입니다 부분 집합은 컬렉션에 강력하게 형식화 됨 ImageViewModel

@model List<ImageViewModel> 
@foreach(var item in Model) 
{ 
    <img src=@item.URL" id=@item.ID" alt="@item.Name" class="imgItem" /> 
} 

일부 jquery 코드를 추가하여 사용자가 이미지를 선택할 때 이미지 ID를 가져 와서 숨겨진 변수 (SelectedImageID)로 설정하면 양식을 게시 할 때 사용할 수 있습니다.