How to Bind Image in Gridview in MVC4 in asp.net

Introduction:-

              in this Example we Expalin How to Bind Image in Gridview in Mvc4 in Asp.net with Insert update Delete Facility.

Description:-

                We can Bind the Image same as we done in C#.Net but Here we have to manage each code in Diiferant File.Look at the Following Code in which we can Bind the Image in Gridview usind asp code in Html Design Form.

For Ex:-

                <% foreach (var item in Model) {  %>

  

        <tr>

            <td>

                <%= Html.ActionLink("Edit", "Edit", new { id=item.id }) %> |

                <%= Html.ActionLink("Details", "Details", new { id=item.id })%>

            </td>

            <td>

                <%= Html.Encode(item.id) %>

            </td>

            <td>

                <%= Html.Encode(item.name) %>

            </td>

            <td>

            <%

                Response.Write("<img src='../../Content/"+item.photo+"' alt='ii' width='80' height='80' />");

             %>

      

            </td>

        </tr>

  

    <% } %>

  

Look at the above Examle through Freach Loop We can Bind All Record and each Record was Define with a  Edit <%= Html.ActionLink("Edit", "Edit", new { id=item.id }) %> | and Details  <%= Html.ActionLink("Details", "Details", new { id=item.id })%>

Link in Gridview Format.

  we Fetch the Image and Bind this Image in GridView by using this Code like

<td>

            <%

                Response.Write("<img src='../../Content/"+item.photo+"' alt='ii' width='80' height='80' />");

             %>

      

            </td>

Look also <%= Html.ActionLink("Create New", "Create") %> this will Automatically Create a Link For Add New Record.

Insert,Update,Delete in MOdalPopup in MVC4 CRUD operation in Popup in MVC

change the Background color of selected Gridview Row Change color based on checkbox selection

Autocomplete TextBox Search Example Autocomplete in Ajax

Index page:-

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<demo.Models.demoimage>>" %>

<%@ Import Namespace="System" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">

    Index

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<form id="d" runat="server">

    <h2>Index</h2>

    <table>

        <tr>

            <th></th>

            <th>

                id

            </th>

            <th>

                name

            </th>

            <th>

                photo

            </th>

        </tr>

    <% foreach (var item in Model) {  %>

  

        <tr>

            <td>

                <%= Html.ActionLink("Edit", "Edit", new { id=item.id }) %> |

                <%= Html.ActionLink("Details", "Details", new { id=item.id })%>

            </td>

            <td>

                <%= Html.Encode(item.id) %>

            </td>

            <td>

                <%= Html.Encode(item.name) %>

            </td>

            <td>

            <%

                Response.Write("<img src='../../Content/"+item.photo+"' alt='ii' width='80' height='80' />");

             %>

      

      

            

            </td>

        </tr>

  

    <% } %>

  

  

    </table>

    <p>

        <%= Html.ActionLink("Create New", "Create") %>

    </p>

</form>

</asp:Content>

//In ControllerClass

[AcceptVerbs(HttpVerbs.Post)]

        public ActionResult Create(FormCollection collection)

        {

            try

            {

                foreach (string file in Request.Files)

                {

                    HttpPostedFileBase posted = (HttpPostedFileBase)Request.Files[file];

                // string s= Server.MapPath(@"~/Content/" + System.IO.Path.GetFileName(posted.FileName));

                 posted.SaveAs(Server.MapPath(@"~/Content/" + System.IO.Path.GetFileName(posted.FileName)));

                    QuestionModelDataContext q1 = new QuestionModelDataContext();

                    demoimage d = new demoimage();

                    d.name = collection["name"].ToString();

                    d.photo =posted.FileName;

                    q1.demoimages.InsertOnSubmit(d);

                    q1.SubmitChanges();

                 

                }

                return RedirectToAction("Index");

            }

            catch

            {

                return View();

            }

        }