Skip to main content

Displaying image is a gridview - ImageField

Can not display images in gridview. Images are not getting displayed in gridview.

Quite often I have seen people getting bugged by this problem. This problem arises normally due to wrong image URL. This is because web server was not able to find the image and thus did not return a valid URL.

Consider a scenario where in my D: drive I have a folder name Images now if there are few images in it and I just wrote a small program to read the file name and display image using a gridview like this:-

Default.aspx -

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="GridView_Image._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    
    <asp:GridView runat="server" ID="gv_Products" AutoGenerateColumns="false"  >

    </asp:GridView>
    <asp:GridView ID="gv_Images" runat="server" AutoGenerateColumns="false">
        <Columns>
            <asp:BoundField DataField="ProductNm"/>
            <asp:ImageField DataImageUrlField="ProductImgPath" >
            </asp:ImageField>
        </Columns>
    </asp:GridView>
</asp:Content>

Default.asp.cs

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.IO;

namespace GridView_Image
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            gv_Images.DataSource = GetTable();
            gv_Images.DataBind();
        }

        private DataTable GetTable()
        {
            string[] fileNames = "D:/Images"));
            

            DataTable dt = new DataTable();

            dt.Columns.Add("ProductNm", typeof(string));
            dt.Columns.Add("ProductImgPath", typeof(string));

            foreach (var fileName in fileNames)
            {
                DataRow dr = dt.NewRow();
                dr[0] = fileName;

                dr[1] = fileName;

                dt.Rows.Add(dr);
            }
            
            return dt;
        }

        private string GetFileName(string fullFileName)
        {
            string[] splittedFileName = fullFileName.Split('\\');

            return splittedFileName[splittedFileName.Length - 1];
        }
    }
}


Here I will not see the images this is because the we have provided an file system filepath but ASP.NET is actually looking for a relative/absolute path. It actually checks under the web directory the application is running in. We certainly can access the images which are not present in the web directory from where the application is running but not this way. I will write a separate entry for that.

I will provide the solution to this problem and will highlight the problems too.

Here the folder "images" is present in the root directory and default.aspx is also present in the root directory. I will write a separate post regarding absolute and relative paths.

        private DataTable GetTable()
        {
            string[] fileNames = Directory.GetFiles(Server.MapPath("~/images"));
            

            DataTable dt = new DataTable();

            dt.Columns.Add("ProductNm", typeof(string));
            dt.Columns.Add("ProductImgPath", typeof(string));

            foreach (var fileName in fileNames)
            {
                DataRow dr = dt.NewRow();
                dr[0] = fileName;

                dr[1] = @"~/images/" + GetFileName(fileName);

                dt.Rows.Add(dr);
            }
            
            return dt;
        }

I am writing this one in hurry and expect few of you to have few question/comments. Please share with us and point out any error.

Hope this will help.
Labels:

Comments

Post a Comment

Popular posts from this blog

Laravel XAMPP MySQL artisan migrate install error mysql.sock

In my previous post I wrote about setting up Laravel 4 on Mac with XAMPP . When I tried to use migrations (using artisan) I faced some issue. I will also post about Laravel migrations soon.    php artisan migrate:install Error :                                                     [PDOException]                                       SQLSTATE[HY000] [2002] No such file or directory                                              Solution : We need to tell artisan which mysql we want it to use. For this to work we need to porivde it with mysql.sock which we want it to use. So change your database settings like this: 'mysql' => array( 'driver'    => 'mysql', 'host'      => 'localhost',     'unix_socket' => '/Applications/xampp/xamppfiles/var/mysql/mysql.sock', 'database'  => 'wedding', 'username'  => 'root', 'password'  => '', '
6 comments
Read more

Add (Drop) a new article (table) at publisher in merge replication

Let us add the article using the GUI first. First of all create the table on publisher database. Now right click on the publisher and select properties from the menu. Click on articles. Uncheck the - "Show only checked articles in the list" checkbox, in order to see the newly added table. Select the table as shown in the figure below. Press ok The article has now been added to the publisher We now need to recreate the snapshot Right click the publication and select – “View snapshot agent status”. Click start to regenerate snapshot. Now right click on the subscription (I have both on same server you may have on different servers) and select “View synchronization status” Click on start on the agent. The schema changes will propagate to the client if you have "Replicate schema changes" property set to true in the publisher.
Post a Comment
Read more

Check SQL Server Job status (State) using sp_help_job and xp_sqlagent_enum_jobs

This article is about checking the status of a SQL job. In our work place we have lot of SQL jobs. These jobs will run whole day and are business critical. They will load the data and generate extracts which will be used by business people. Thus, it becomes quite essential to support the system efficiently so that the job finishes in time and as desired. Also, while designing a new system sometimes we need to check the dependency of one job over another. In such scenario we need to check whether a particular job has finished or not. All this can be achieved in SQL Server by using the procedures:- sp_help_job xp_sqlagent_enum_jobs Note: xp_sqlagent_enum_jobs is an undocumented proc inside of sp_help_job and is used extensively to get SQL agent job information. sp_help_job: This procedure gives some insight into the status, and information, about a job. This stored procedure provides information such as last start time, job status etc. Syntax sp_help_job { [ @job_id= ] jo
2 comments
Read more