Monday, April 30, 2012

Display Different Image in Gridview From Database on Condition

    Here I have created a table in which a column stores the image name of a product. Ex: I am saving a product details with its image name. And also created a Image folder in my application where I have stored the physical image file.I am only displaying the image in form load.

Table Design 


ProductID int
ProductName varchar(50)
ProductImage varchar(50)

Table With Data


1Samsungsamsung01.jpg
2LGlg01.jpg
NULLNULLNULL

Design  View( Source Code)



<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="FrmGridViewStatus.aspx.cs" Inherits="FrmGridViewStatus" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
    <table class="style1">
        <tr>
        <td>
                &nbsp;</td>
        </tr>
        <tr>
        <td>
                &nbsp;</td>
        </tr>
        <tr>
            <td>
                <asp:GridView ID="GridView1" runat="server" Width="370px"
                    AutoGenerateColumns="False">
                    <Columns>
                        <asp:BoundField DataField="id" HeaderText="ID" />
                        <asp:BoundField DataField="name" HeaderText="Name" />
                        <asp:TemplateField HeaderText="Photo">
                            <ItemTemplate>
                             
                                            <asp:Image ID="Image1" runat="server" ImageUrl='<%#GetImage(Eval("ProductImage").ToString())%>' Width="100" Height="100"/>           
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;</td>
        </tr>
        <tr>
            <td>
                &nbsp;</td>
        </tr>
    </table>
</asp:Content>

C# Code



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;


public partial class FrmGridViewStatus : System.Web.UI.Page
{
    SqlConnection con;
    SqlCommand cmd;
    SqlDataReader dr;

    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack == false)
        {
            con = new SqlConnection(ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString);
            getData();
        }

    }
    private void getData()
    {
        try
        {

            con.Open();
            cmd = new SqlCommand("select ProductID,ProductName,ProductImage from product",con);
            dr = cmd.ExecuteReader();
            GridView1.DataSource = dr;
            GridView1.DataBind();
            con.Close();

        }
        catch(Exception ex)
        {
        }
   
    }
    public string GetImage(string ProductImage )
    {
        string ImgURl = "";
        if (ProductImage != null)
        {
           ImgURl="~/Images/"+ProductImage ;
        }
        else{
         
        }
        return ImgURl;
    }
}






No comments:

Post a Comment