Question

I’m trying to display images I’ve loaded previously on a view but getting no success.
Images are uploaded, that’s for sure. So far I’ve written something like this:

@if(Model.AttachedInformation.Count > 0)
{
    <div id="gallery">
        @foreach(var path in Model.AttachedInformation)
        {
            <img src="@path" alt="default_description" title="some_title" />
        }
    </div>
}

AttachedInformation is simply a ICollection<String> object.

But that’s giving me only borders of images. Moreover I checked @path variable and it’s really keeping full file paths.

Suggestions are appreciated!
Thanks!

EDIT: CONTROLLER

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create(Employee employee, IEnumerable<HttpPostedFileBase> files)
{
    if(ModelState.IsValid)
    {
        var filepath = String.Empty;

        foreach(var file in files)
        {
            if(null != file && file.ContentLength > 0)
            {
                filepath = Path.Combine(
                    HttpContext.Server.MapPath("~/Content/Images/Uploads"),
                    Path.GetFileName(file.FileName)
                );
                file.SaveAs(filepath);
                employee.AttachedInformation.Add(filepath);
            }
        }                

        this.repository.Add(employee);

        return Redirect("/");
    }
    else
    {
        return View(employee);
    }
}

MODEL

AbstractEntity keeps Version and ID properties.

[Serializable]
public class Employee : AbstractEntity<Employee>, IAggregateRoot
{
    public Employee()
    {
        this.AttachedInformation = new HashSet<String>();
    }

    public virtual String FirstName { get; set; }
    public virtual String MiddleName { get; set; }
    public virtual String LastName { get; set; }
    public virtual String SSN { get; set; }
    public virtual String EmployeeNumber { get; set; }
    public virtual String TradeUnionNumber { get; set; }
    public virtual String Department { get; set; }
    public virtual String Post { get; set; }
    public virtual DateTime DateOfHire { get; set; }
    public virtual DateTime DateOfBirth { get; set; }
    public virtual ICollection<String> AttachedInformation { get; set; }
}

VIEW

View contains several inputs with name files like:

<input type="file" name="files" id="additional" class=" " accept="image/jpeg,image/png,image/gif" />

RAW HTML

<div id="gallery">
    <img src="D:\Programming.Projects\BOA\branches\BOA.PresentationLayer\Content\Images\Uploads\Desert.jpg" alt="default_description" title="some_title" />
    <img src="D:\Programming.Projects\BOA\branches\BOA.PresentationLayer\Content\Images\Uploads\Hydrangeas.jpg" alt="default_description" title="some_title" />
    <img src="D:\Programming.Projects\BOA\branches\BOA.PresentationLayer\Content\Images\Uploads\Jellyfish.jpg" alt="default_description" title="some_title" />
    <img src="D:\Programming.Projects\BOA\branches\BOA.PresentationLayer\Content\Images\Uploads\Koala.jpg" alt="default_description" title="some_title" />
</div>

BOUNTY

What I need is to get an illustrated example (that works). Thanks!

Answer 1

Ok. I found a solution. Maybe it will be useful for somebody.

var directory = "/Content/Images/Uploads/" + employee.SSN;
var path = String.Empty;

if(!Directory.Exists(Server.MapPath(directory)))
{
    Directory.CreateDirectory(Server.MapPath(directory));
}

foreach(var file in files)
{
    if(null != file && file.ContentLength > 0)
    {
        path = Path.Combine(directory + "/", Path.GetFileName(file.FileName));
        file.SaveAs(Server.MapPath(path));
        employee.AttachedInformation.Add(path);
    }
}

That works for me. Corrections are appreciated.