Show images in table from database in Asp.net-mvc3

Question

I have a table containing user information with image field and storing image in binary data.

I want to show this images on my view page in a table with user information.

my code is.. Controller

public ActionResult About()
        {
var data = db.dbtable.ToList();
return View(data);
}

Get Image method // reg is object of dbtable

public FileContentResult GetImage(int id)
        {            
            reg = db.dbtable.FirstOrDefault(i => i.RegNo == id);            
            if (reg != null)
            {
                return File(reg.Photo, "image/jpeg");
            }
            else
            {
                return null;
            }
        }

on view page..

@model IEnumerable<MvcMySchool.dbtable>

<table width="50">
    <tr>
        <th> 
            Registration No.
        </th>
        <th>
            First Name
        </th>
        <th>
            Last Name
        </th>
        <th>
            City
        </th>
        <th>
            Photo
        </th>
    </tr>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.RegNo)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.FirstName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.LastName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.City)
            </td>
            <td>
            @*HttpContext.Current.Response.Write("<img width="75" height="75" src=@(Url.Action("GetImage", "Home", new { id = item.RegNo })) />")*@
                <img width="75" height="75" src=@(Url.Action("GetImage", "Home", new { id = item.RegNo })) />
            </td>
        </tr>
    }
</table>

It only shows the image in the first row and nothing after that.

Thanks..

B. Bilgin · Accepted Answer · 2012-07-03 11:17:38Z

1

May make more sense just to keep the path the image.

If you filesteam,

public FileStreamResult GetImage(int id)
{

reg = db.dbtable.FirstOrDefault(i => i.RegNo == id);            
            if (reg != null)
            {

    MemoryStream ms = new MemoryStream(reg.Photo);
    return File(ms, "image/png");

            }
            else
            {
                return null;
            }
}

more logical way to keep, ony way

public FileResult GetImage(int id)
{
reg = db.dbtable.FirstOrDefault(i => i.RegNo == id);            
                if (reg != null)
                {
    FileInfo fi = new FileInfo(Server.MapPath(reg.Photo));
    return File(fi.OpenRead, "image/png");
                }
}

for both

<tr>
    <td>
       <img src="/Home/GetImage/@item.RegNo" alt="" />
    </td>
</tr>

edited Jul 3, 2012 at 11:17

answered Jul 3, 2012 at 11:12

B. Bilgin

78313 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

krish Over a year ago

thanks for reply i first logic it show only one image on first row of table. i want all the images from the database and show each image in each table row..

B. Bilgin Over a year ago

Ok. @foreach (var item in Model) {<img src="/Home/GetImage/@item.RegNo" alt="" />}

B. Bilgin Over a year ago

if you for path use @foreach (var item in Model) {<img src="@item.PHOTO" alt="" />} page in after render <img src="/Content/Images/krish.png" alt="" />

krish Over a year ago

i m not having image in content folder in database image store in binary data (in byte)

B. Bilgin Over a year ago

Use first code sample action and use view <img src="/Home/GetImage/@item.RegNo" alt="" /> for see image, browser url localhost/Home/GetImage/5

|

Collectives™ on Stack Overflow

Show images in table from database in Asp.net-mvc3

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related