object with many uploaded images

Question

I'm building a simple web app. Scenario is the following.

1. Image upload
2. Create new object with selecting one or more images (previously uploaded)
3. Display object wiht corresponding image(s)

I was thinking to create something like this

SampleObject.cs
    Guid Id {get; set;}
    string Name {get; set;}

Image.cs
Guid Id {get; set;}
string Name {get; set;}
string ImagePath {get; set;}
SampleObject SampleObject {get; set;}

But on the other hand I only need SampleObjects with many ImagePath strings. So better the way would be to simplify this to have only SampleObjects with many strings (ImagePath).

So, the second scenario would be like following

1. Upload image
2. Create object and using jquery onclick select one or many images (read img src element) and store these strings inside SampleObject list of strings.

Do the second scenario seems better to you, and if it does how would you create these entities (sampleobject.cs and image.cs).

Answer 1

I would approach this problem like this:

Create a simple Model for any Image you may have.

public class UploadedImageModel
{
    public string ImagePathUrl { get; set; }
    public string AlternateText { get; set; }
}

Create a simple ViewModel that has a collection of Images you may want to display.

public class ImageGalleryViewModel
{
    public List<UploadedImageModel> Images { get; set; }
}

Then in your View:

@model MyApp.WebUI.Models.ImageGalleryViewModel

@foreach(var pic in Model.Images) {

    <img src="pic.ImagePathUrl" alt="pic.AlternateText" /> 

}