Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

I want to retrieve Image from database and display it same controller 'Index' view or other controller 'Index' view. I think already I successfully insert Image data in database. Here is my code..Can anybody help me that what action/method and 'Html' form now I should write in my code..

Model class Picture:

public class Picture
{
    public int PictureId { get; set; }
    public string Name { get; set; }
    public static byte[] Image { get; set; }
}

PictureController:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(Picture picture)
{
        byte[] Image;
        if (Request.Files["files"] != null)
        {
            using (var binaryReader = new BinaryReader(Request.Files["file"].InputStream))
            {
                Image = binaryReader.ReadBytes(Request.Files["files"].ContentLength);
            }
            Picture.Image = Image;
        }
        if (ModelState.IsValid)
        {
            db.Pictures.Add(picture);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        return View(picture);
    }

Create view of PictureController

 @model PartialView.Models.Picture

 @{ ViewBag.Title = "Create";   }

   <h2>Create</h2>

   @using (Html.BeginForm(null, null, FormMethod.Post, 
     new { enctype = "multipart/form- data" }))
 {
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)

<fieldset>
    <legend>Picture</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Name)
        @Html.ValidationMessageFor(model => model.Name)
    </div>
    <td>File :</td>
    <td><input type="file" name="Image" id="Image" /> </td>

    <p>
        <input type="submit" value="Create" />
    </p>
</fieldset>  }
<div>
   @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts { @Scripts.Render("~/bundles/jqueryval") }

Database table after insert of two data rows:

PictureId    Name
-------------------------
    1        Song
    2        Clothes    
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
172 views
Welcome To Ask or Share your Answers For Others

1 Answer

In order to display image in the UI you need to define a controller action which has a return type of filecontentresult. following is an example :

public FileContentResult getImg(int id)
{
    byte[] byteArray = DbContext.Persons.Find(id).Image;
    if (byteArray != null)
    {
        return new FileContentResult(byteArray, "image/jpeg");
    }
    else
    {
        return null;
    }
}

Once you have defined the controller action then you can use following line of code to show the byte[] as an image in the view.

<img src="@Url.Action("getImg", "Person", new { id = item.Id })" alt="Person Image" />

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share

548k questions

547k answers

4 comments

86.3k users

...