0

我正在尝试允许用户选择图像并向其添加一些附加信息。

我有一个包含附加信息的对象 - 让我们保持简单并说出它的两个字符串 - 和一个图像

[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; }
}

对于创建视图,我想向用户显示数据库中所有现有图像的两个文本字段和一个“画廊”类型布局。

我希望 iamge 画廊部分是一个局部视图,这样我也可以在其他地方重用它。

我无法弄清楚如何显示图像,也无法看到用户在控制器中选择了哪一个来链接它们。我对它进行成像将需要一些特定于视图的模型,但除此之外,我正在画一个空白。

有人可以指出我正确的方向吗?

附言。将 ImageInfo 和 Image 存储在单独的表中的原因是每个 Image 会有很多 ImageInfo。

4

1 回答 1

1

是的。你需要一些特定的视图模型。我们将其称为 ViewModel。它们是在视图中使用的简单 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);
}

现在我们的视图将被强类型化到我们的视图模型中

@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 并将其设置为表单中的 Hidden 变量(SelectedImageID),以便在发布表单时可用。

于 2012-10-18T17:47:20.577 回答