How to retrieve image from database without using Entity Framework in ASP.NET MVC4

Question

I'm new to ASP.NET MVC and I need some help from you. I'm trying to create insert and get image from database and I can save an image into binary format but I can't get it back into image format

My output is like below image

enter image description here

Here is my view

@model IEnumerable<HelphoProject.Models.Property>
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<p>
    hi you are now in Index page of HElpho
</p>

<div>
     @Html.DropDownList("CityID", (IEnumerable<SelectListItem>)ViewBag.CityList,"Select City")
</div>

<div>
    @Html.DropDownList("propertyTypeID",(IEnumerable<SelectListItem>)ViewBag.PropertyTypeList,"Select PropertyType")
</div>

@Html.ActionLink("Add New Property", "AddNewProperty",null, new { @class="btn btn-primary"})

<table class="table" style="width: 1200px;">
    <tr>
        <th>

            <b>ImageID</b>
        </th>
        <th>
            <b>CityID</b>
        </th>
        <th>
            <b>TypeID</b>
        </th>
        <th>
            <b>Image</b>
        </th>
        <th>
            <b>Description</b>
        </th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(a =>item.ImageID )
            </td>
            <td>
                @Html.DisplayFor(a=>item.CityID)
            </td>
            <td>
                @Html.DisplayFor(a=>item.propertyTypeID)
            </td>
           <td style="width: 500px;">
                @Html.Raw(item.Image)
            </td>
            <td>
             <img src="/Content/RetrieveImage/@item.ImageID" alt="" height=100 width=200 />
            </td>
            <td>
                @Html.DisplayFor(a=>item.Description)
            </td>
            <td style="width: 500px;">

                @*@Html.Raw(item.content)*@
            </td>
            <td>

            </td>
            <td>
            @*    @Html.DisplayFor(modelItem => item.Description)*@
            </td>
        </tr>
    }
</table>

Here is my controller code:

using HelphoProject.DataAccessLayer;
using HelphoProject.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace HelphoProject.Controllers
{
    public class PropertyController : Controller
    {
        //
        // GET: /Property/
        [HttpGet]
        public ActionResult Index()
        {
            Cities();
            getPropertyType();

            readwriteProperty writedata = new readwriteProperty();
            List<Property> propertyList = writedata.getproperties();
            var content = propertyList.Select(item => new Property()
            {
                ImageID = item.ImageID,
                CityID = item.CityID,
                propertyTypeID = item.propertyTypeID,
                Image = item.Image,
                Description = item.Description
            });

            List<Property> contentModel = content.Select(item => new Property()
                {

                    ImageID = item.ImageID,
                    CityID = item.CityID,
                    propertyTypeID = item.propertyTypeID,
                    Image = item.Image,
                    Description = item.Description 
                }).ToList();
            RetrieveImage(1);

            return View(contentModel);
        }

        public ActionResult RetrieveImage(int id)
        {
            byte[] cover = GetImageFromDataBase(id);
            if (cover != null)
            {
                return File(cover, "image/jpg");
            }
            else
            {
                return null;
            }
        }
        /// <summary>
        /// 
        /// </summary>
        /// <param name="Id"></param>
        /// <returns></returns>
        public byte[] GetImageFromDataBase(int Id)
        {
            readwriteProperty writedata = new readwriteProperty();

            byte[] Image = writedata.getImageFromDB();
            return Image;
        }

        public ActionResult Cities()
        {
            readwriteCity dbconnection = new readwriteCity();
            List<City> pcontent = new List<City>();
            {
                //Get all page content from TblHome table
                pcontent = dbconnection.getAllCities();

            };
            List<SelectListItem> cityList = new List<SelectListItem>();
            //List<string> items = new List<string>(); 
            foreach (var item in pcontent)
            {
                cityList.Add(new SelectListItem
                {
                    Text = item.CityName,
                    Value = item.CityID.ToString()
                });
            }

            ViewBag.CityList = cityList;
            return View();
        }

        public ActionResult getPropertyType()
        {
            readwritePropertyType dbconnection = new readwritePropertyType();
            List<PropertyType> pcontent = new List<PropertyType>();
            {
               // Get all page content from TblHome table
                pcontent = dbconnection.getAllPropertyType();

            };
            List<SelectListItem> propertyTypeList = new List<SelectListItem>();
            List<string> items = new List<string>(); 
            foreach (var item in pcontent)
            {
                propertyTypeList.Add(new SelectListItem
                {
                    Text = item.propertyType,
                    Value = item.propertyTypeID.ToString()
                });
            }

            ViewBag.PropertyTypeList = propertyTypeList;

            return View();
        }

        public ActionResult AddNewProperty()
        {
            Cities();
            getPropertyType();
            return View();
        }

        [HttpPost]
        public ActionResult AddNewProperty(Property objProperty)
        {

            HttpPostedFileBase file = Request.Files["ImageData"];
            readwriteProperty writedata = new readwriteProperty();
            string str = writedata.SaveProperty(file, objProperty);
            if (str == "Data Saved Successfully")
            {
                return RedirectToAction("Index");
            }
            return View(objProperty);
        }
    } 
}

Here is my model:

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;


namespace HelphoProject.Models
{
    public class Property
    {
        public int ImageID { get; set; }
        public int CityID { get; set; }
        public int propertyTypeID { get; set; }

        [Required]
        public byte[] Image { get; set; }

        public string Description { get; set; }
    }
}

And I have used one more thing to connect with database

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
using HelphoProject.Models;
using System.IO;

namespace HelphoProject.DataAccessLayer
{
    public class readwriteProperty
    {

        SqlConnection cn = new SqlConnection(ConfigurationManager.ConnectionStrings["mycon"].ConnectionString);
        SqlCommand cmd;
        SqlDataAdapter sda;
        DataTable dt;

        public string SaveProperty(HttpPostedFileBase file, Property objproperty)
        {
            objproperty.Image = ConvertToBytes(file,null);

            cmd = new SqlCommand("spSaveProperty", cn);
            cmd.CommandType = CommandType.StoredProcedure;

            // cmd.Parameters.AddWithValue("@intStateID", objCity.StateID);
            cmd.Parameters.AddWithValue("@ImageID", objproperty.ImageID);
            cmd.Parameters.AddWithValue("@CityID", objproperty.CityID);
            cmd.Parameters.AddWithValue("@TypeID", objproperty.propertyTypeID);
            cmd.Parameters.AddWithValue("@Image", objproperty.Image);
            cmd.Parameters.AddWithValue("@Description", objproperty.Description);
            cn.Open();
            try
            {
                cmd.ExecuteNonQuery();
            }
            catch (Exception ex)
            {
                return "Datat Not Saved Successfully";
            }
            cn.Close();

            return "Data Saved Successfully";
        }

        public byte[] getImageFromDB()
        {
            cn.Open();
            sda = new SqlDataAdapter("select Image FROM  tblImages", cn);
            dt = new DataTable();
            sda.Fill(dt);

            Property objmainProperty = new Property();
            foreach (DataRow dr in dt.Rows)
            {
                Property objProperty = new Property();
                objProperty.Image=(byte[])dr["Image"];
                objmainProperty.Image = objProperty.Image;
            }
            cn.Close();
            return objmainProperty.Image;
          }

        public List<Property> getproperties()
        {
            cn.Open();
            sda = new SqlDataAdapter("select ImageID,CityID,TypeID,Image,Description from tblImages", cn);
            dt = new DataTable();
            sda.Fill(dt);

            List<Property> properties = new List<Property>();

            foreach(DataRow dr in dt.Rows)
            {
                Property objProperty = new Property();
                objProperty.ImageID = Convert.ToInt16(dr["ImageID"]);
                objProperty.CityID = Convert.ToInt16(dr["CityID"]);
                objProperty.propertyTypeID = Convert.ToInt16(dr["TypeID"]);
                objProperty.Image = (byte[])dr["Image"];
                objProperty.Description = dr["Description"].ToString();

                properties.Add(objProperty);
            }

            cn.Close();
            return properties;
        }

        public byte[] ConvertToBytes(HttpPostedFileBase image,Property objproperty)
        {
            if (image != null)
            {
                byte[] imageBytes = null;
                BinaryReader reader = new BinaryReader(image.InputStream);
                imageBytes = reader.ReadBytes((int)image.ContentLength);
                return imageBytes;
            }
            else
            {
                byte[] imageBytes = objproperty.Image;
                BinaryReader reader = new BinaryReader(image.InputStream);
                imageBytes = reader.ReadBytes((int)image.ContentLength);
                return imageBytes;
            }
        }
    }
}

Using this code I can upload and save my images in to database and I can get all data from data. I can get image also but in binary format I think you can understand more after watching below image

Roy Truelove · Accepted Answer · 2014-08-08 14:07:18Z

2

You have used the wrong model name. Change

img src="/Content/RetrieveImage/@item.ImageID" alt="" height=100 width=200

to

img src="/Property/RetrieveImage/@item.ImageID" alt="" height=100 width=200

in view section.

edited Aug 8, 2014 at 14:07

Roy Truelove

22.6k21 gold badges116 silver badges154 bronze badges

answered Aug 8, 2014 at 14:04

user3922585

362 bronze badges

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

Collectives™ on Stack Overflow

How to retrieve image from database without using Entity Framework in ASP.NET MVC4

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related