How to display binary images from a database for editing a form using MVC 4

Question

I successfully save images in a database as binary images. I want to display these images in the "Edit" form in order to modify and save the changes. 'System.OutOfMemoryException' was selected in the form of Edit.cshtml when displaying binary images from the database.

Can someone fix my code.

Model class:

public class Accommodation
    {
        [Key]
        public string A_Unique_Id { get; set; }

        public byte[] Picture1 { get; set; }

        public byte[] Picture2 { get; set; }

        public byte[] Picture3 { get; set; }


  }

// GET: / Placement / Editing / 5

public ActionResult Edit(string id)
    {
        Accommodation accommodation = db.Accommodation.Find(id);
        ViewBag.SelectedAustraliaStateId = new SelectList(db.AustraliaStates, "AustraliaStateId", "AustraliaStateName", accommodation.SelectedAustraliaStateId);

        return View(accommodation);
    }

// POST: / Accommodation / Editing / 5

[HttpPost]
public ActionResult Edit(Accommodation accommodation)
{
    if (ModelState.IsValid)
    {
        db.Entry(accommodation).State = EntityState.Modified;

        //the following line is for re-assigning back the DDL modified value.
        accommodation.State = accommodation.SelectedAustraliaStateId;

        db.SaveChanges();
        return RedirectToAction("Index");
    }
    return View(accommodation);
}

Edit.cshtml

<div class="editor-label">
        @Html.LabelFor(model => model.Picture1)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Picture1)
        @Html.ValidationMessageFor(model => model.Picture1)
    </div>

ERROR MESSAGE: An exception of type 'System.OutOfMemoryException' was thrown on the [e-mail](model => model.Picture1)

Answer 1

<form  method="post" enctype="multipart/form-data">
@{
    if (Model.Picture1 != null)
      {
         string imageBase64 = Convert.ToBase64String(Model.Picture1);
         string imageSrc = string.Format("data:image/gif;base64,{0}", imageBase64);
         <img src="@imageSrc" width="100" height="100" />
      }
  }
    <input type="file" name="photo" id="files" accept="image/*;capture=camera">
    <button type="button">Submit</button>
  </form>

[HttpPost]
public ActionResult Edit(Accommodation accommodation)
{

  if (Request.Files["files"] != null)
    {
            byte[] Image;
            using (var binaryReader = new BinaryReader(Request.Files["files"].InputStream))
            {
                Image = binaryReader.ReadBytes(Request.Files["files"].ContentLength);
            }
    }
    accommodation.Picture1=Image;
  //your code to save data
}

Answer 2

byte[] imageByteData = System.IO.File.ReadAllBytes(imageFile);

string imageBase64Data = Convert.ToBase64String(imageByteData);

string imageDataURL = string.Format("data:image/jpg;base64{0}",imageBase64Data);

Session["photo"] = imageDataURL;

_layout.cshtml .