ImageField Class

Represents a field that is displayed as an image in a data-bound control.

Namespace: System.Web.UI.WebControls
Assembly: System.Web (in system.web.dll)

public class ImageField : DataControlField
public class ImageField extends DataControlField
public class ImageField extends DataControlField
Not applicable.

The ImageField class is used by data-bound controls (such as GridView and DetailsView) to display an image for each record displayed. The ImageField object is displayed differently depending on the data-bound control in which it is used. For example, the GridView control displays an ImageField object as a column, while the DetailsView control displays it as a row.

To display images, you must bind an ImageField object to a field from a data source that contains the URL of an image. This is accomplished by setting the DataImageUrlField property. The URL value can be formatted by using the DataImageUrlFormatString property. Each image can also have alternate text associated with it. This text is displayed when an image cannot be loaded, or is unavailable. Browsers that support the ToolTips feature also display this text as a ToolTip. You can specify the alternate text for a displayed image by using one of the following methods:

  • Use the AlternateText property to specify alternate text that applies to all images.

  • Use the DataAlternateTextField property to bind a field from a data source to the AlternateText property of each image. This allows you to have different alternate text for each image displayed. When binding data, you can optionally format the alternate text by using the DataAlternateTextFormatString property.

When the URL value for an image is a null reference (Nothing in Visual Basic), an image cannot be displayed. You can display an alternate image for a null reference (Nothing in Visual Basic) field values by setting the NullImageUrl property. Instead of an alternate image, you can display alternate text by setting the NullDisplayText property.

By default, all declared fields are displayed in a data-bound control. You can hide an ImageField object in a data-bound control by setting the Visible property to false.

You can customize the header and footer sections of an ImageField object. To display a caption in the header or footer section, set the HeaderText or FooterText properties, respectively. To display an image in the header section instead of text, set the HeaderImageUrl property. The header section can be hidden in the ImageField object by setting the ShowHeader property to false.


Some data-bound controls (such as the GridView control) can show or hide only the entire header section of the control. These data-bound controls do not support the ShowHeader property for an individual data-bound field. To show or hide the entire header section of a data-bound control, use the control's ShowHeader property (if available).

You also can customize the appearance of the ImageField object (font color, background color, and so on) by setting the style properties for the different parts of the field. The following table lists the different style properties.

Style property



The style settings for the child Web server controls of the ImageField object.


The style settings for the footer section of the ImageField object.


The style settings for the header section of the ImageField object.


The style settings for the data items in the ImageField object.

The following example demonstrates how to use an ImageField object in a GridView control to display an image.

<%@ Page language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="" >
  <head runat="server">
    <title>ImageField Example</title>
    <form id="form1" runat="server">
      <h3>ImageField Example</h3>
      <asp:gridview id="EmployeesGrid"

          <asp:imagefield dataimageurlfield="PhotoPath"
            alternatetext="Employee Photo"
            nulldisplaytext="No image on file."
          <asp:boundfield datafield="FirstName"
            headertext="First Name"/>
          <asp:boundfield datafield="LastName"
            headertext="Last Name"/>
      <!-- This example uses Microsoft SQL Server and connects  -->
      <!-- to the Northwind sample database. Use an ASP.NET     -->
      <!-- expression to retrieve the connection string value   -->
      <!-- from the Web.config file.                            -->
      <asp:sqldatasource id="EmployeeSource"
        selectcommand="Select [EmployeeID], [LastName], [FirstName], [PhotoPath] From [Employees]"
        connectionstring="<%$ ConnectionStrings:NorthWindConnectionString%>" 

  • AspNetHostingPermission  for operating in a hosted environment. Demand value: LinkDemand; Permission value: Minimal.
  • AspNetHostingPermission  for operating in a hosted environment. Demand value: InheritanceDemand; Permission value: Minimal.


Any public static (Shared in Visual Basic) members of this type are thread safe. Any instance members are not guaranteed to be thread safe.

Windows 98, Windows Server 2000 SP4, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter Edition

The Microsoft .NET Framework 3.0 is supported on Windows Vista, Microsoft Windows XP SP2, and Windows Server 2003 SP1.

.NET Framework

Supported in: 3.0, 2.0