Export (0) Print
Expand All

GridView Class

Note: This class is new in the .NET Framework version 2.0.

Displays the values of a data source in a table where each column represents a field and each row represents a record. The GridView control allows you to select, sort, and edit these items.

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

[ControlValuePropertyAttribute("SelectedValue")] 
public class GridView : CompositeDataBoundControl, IPostBackContainer, IPostBackEventHandler, ICallbackContainer, 
	ICallbackEventHandler
/** @attribute ControlValuePropertyAttribute("SelectedValue") */ 
public class GridView extends CompositeDataBoundControl implements IPostBackContainer, IPostBackEventHandler, 
	ICallbackContainer, ICallbackEventHandler
ControlValuePropertyAttribute("SelectedValue") 
public class GridView extends CompositeDataBoundControl implements IPostBackContainer, IPostBackEventHandler, 
	ICallbackContainer, ICallbackEventHandler

The GridView control is used to display the values of a data source in a table. Each column represents a field, while each row represents a record. The GridView control supports the following features:

  • Binding to data source controls, such as SqlDataSource.

  • Built-in sorting capabilities.

  • Built-in updating and deleting capabilities.

  • Built-in paging capabilities.

  • Built-in row selection capabilities.

  • Programmatic access to the GridView object model to dynamically set properties, handle events, and so on.

  • Multiple key fields.

  • Multiple data fields for the hyperlink columns.

  • Customizable appearance through themes and styles.

NoteNote

If you are familiar with the DataGrid control from the .NET Framework version 1.0, the GridView control is the successor to the DataGrid control.

Column Fields

Each column in the GridView control is represented by a DataControlField object. By default, the AutoGenerateColumns property is set to true, which creates an AutoGeneratedField object for each field in the data source. Each field is then rendered as a column in the GridView control in the order that each field appears in the data source.

You can also manually control which column fields appear in the GridView control by setting the AutoGenerateColumns property to false and then defining your own column field collection. Different column field types determine the behavior of the columns in the control. The following table lists the different column field types that can be used.

Column field type

Description

BoundField

Displays the value of a field in a data source. This is the default column type of the GridView control.

ButtonField

Displays a command button for each item in the GridView control. This allows you to create a column of custom button controls, such as the Add or the Remove button.

CheckBoxField

Displays a check box for each item in the GridView control. This column field type is commonly used to display fields with a Boolean value.

CommandField

Displays predefined command buttons to perform selecting, editing, or deleting operations.

HyperLinkField

Displays the value of a field in a data source as a hyperlink. This column field type allows you to bind a second field to the hyperlink's URL.

ImageField

Displays an image for each item in the GridView control.

TemplateField

Displays user-defined content for each item in the GridView control according to a specified template. This column field type allows you to create a custom column field.

To define a column field collection declaratively, first add opening and closing <Columns> tags between the opening and closing tags of the GridView control. Next, list the column fields that you want to include between the opening and closing <Columns> tags. The columns specified are added to the Columns collection in the order listed. The Columns collection stores all the column fields in the control and allows you to programmatically manage the column fields in the GridView control.

Explicitly declared column fields can be displayed in combination with automatically generated column fields. When both are used, explicitly declared column fields are rendered first, followed by the automatically generated column fields.

NoteNote

Automatically generated column fields are not added to the Columns collection.

Binding to Data

The GridView control can be bound to a data source control (such as SqlDataSource, ObjectDataSource, and so on), as well as any data source that implements the System.Collections.IEnumerable interface (such as System.Data.DataView, System.Collections.ArrayList, or System.Collections.Hashtable). Use one of the following methods to bind the GridView control to the appropriate data source type:

  • To bind to a data source control, set the DataSourceID property of the GridView control to the ID value of the data source control. The GridView control automatically binds to the specified data source control and can take advantage of the data source control's capabilities to perform sorting, updating, deleting, and paging functionality. This is the preferred method to bind to data.

  • To bind to a data source that implements the System.Collections.IEnumerable interface, programmatically set the DataSource property of the GridView control to the data source and then call the DataBind method. When using this method, the GridView control does not provide built-in sorting, updating, deleting, and paging functionality. You need to provide this functionality by using the appropriate event.

For more information on data binding, see Accessing Data with ASP.NET.

NoteNote

This control can be used to display user input, which might include malicious client script. Check any information that is sent from a client for executable script, SQL statements, or other code before displaying it in your application. Whenever possible, it is strongly recommended that values are HTML-encoded before they are displayed in this control (the BoundField class HTML-encodes values by default). ASP.NET provides an input request validation feature to block script and HTML in user input. Validation server controls are also provided to assess user input. For more information, see Introduction to the Validation Controls.

Data Operations

The GridView control provides many built-in capabilities that allow the user to sort, update, delete, select, and page through items in the control. When the GridView control is bound to a data source control, the GridView control can take advantage of the data source control's capabilities and provide automatic sorting, updating, and deleting functionality.

NoteNote

The GridView control can provide support for sorting, updating, and deleting with other types of data sources; however, you will need to provide an appropriate event handler with the implementation for these operations.

Sorting allows the user to sort the items in the GridView control with respect to a specific column by clicking on the column's header. To enable sorting, set the AllowSorting property to true.

The automatic updating, deleting, and selection functionalities are enabled when a button in a ButtonField or TemplateField column field, with a command name of "Edit", "Delete", and "Select", respectively, is clicked. The GridView control can automatically add a CommandField column field with an Edit, Delete, or Select button if the AutoGenerateEditButton, AutoGenerateDeleteButton, or AutoGenerateSelectButton property is set to true, respectively.

NoteNote

Inserting records into the data source is not directly supported by the GridView control. However, it is possible to insert records by using the GridView control in conjunction with the DetailsView or FormView control. For more information, see DetailsView or FormView, respectively.

Instead of displaying all the records in the data source at the same time, the GridView control can automatically break the records up into pages. To enable paging, set the AllowPaging property to true.

Customizing the User Interface

You can customize the appearance of the GridView control by setting the style properties for the different parts of the control. The following table lists the different style properties.

Style property

Description

AlternatingRowStyle

The style settings for the alternating data rows in the GridView control. When this property is set, the data rows are displayed alternating between the RowStyle settings and the AlternatingRowStyle settings.

EditRowStyle

The style settings for the row being edited in the GridView control.

EmptyDataRowStyle

The style settings for the empty data row displayed in the GridView control when the data source does not contain any records.

FooterStyle

The style settings for the footer row of the GridView control.

HeaderStyle

The style settings for the header row of the GridView control.

PagerStyle

The style settings for the pager row of the GridView control.

RowStyle

The style settings for the data rows in the GridView control. When the AlternatingRowStyle property is also set, the data rows are displayed alternating between the RowStyle settings and the AlternatingRowStyle settings.

SelectedRowStyle

The style settings for the selected row in the GridView control.

You can also show or hide different parts of the control. The following table lists the properties that control which parts are shown or hidden.

Property

Description

ShowFooter

Shows or hides the footer section of the GridView control.

ShowHeader

Shows or hides the header section of the GridView control.

Events

The GridView control provides several events that you can program against. This allows you to run a custom routine whenever an event occurs. The following table lists the events supported by the GridView control.

Event

Description

PageIndexChanged

Occurs when one of the pager buttons is clicked, but after the GridView control handles the paging operation. This event is commonly used when you need to perform a task after the user navigates to a different page in the control.

PageIndexChanging

Occurs when one of the pager buttons is clicked, but before the GridView control handles the paging operation. This event is often used to cancel the paging operation.

RowCancelingEdit

Occurs when a row's Cancel button is clicked, but before the GridView control exits edit mode. This event is often used to stop the canceling operation.

RowCommand

Occurs when a button is clicked in the GridView control. This event is often used to perform a task when a button is clicked in the control.

RowCreated

Occurs when a new row is created in the GridView control. This event is often used to modify the contents of a row when the row is created.

RowDataBound

Occurs when a data row is bound to data in the GridView control. This event is often used to modify the contents of a row when the row is bound to data.

RowDeleted

Occurs when a row's Delete button is clicked, but after the GridView control deletes the record from the data source. This event is often used to check the results of the delete operation.

RowDeleting

Occurs when a row's Delete button is clicked, but before the GridView control deletes the record from the data source. This event is often used to cancel the deleting operation.

RowEditing

Occurs when a row's Edit button is clicked, but before the GridView control enters edit mode. This event is often used to cancel the editing operation.

RowUpdated

Occurs when a row's Update button is clicked, but after the GridView control updates the row. This event is often used to check the results of the update operation.

RowUpdating

Occurs when a row's Update button is clicked, but before the GridView control updates the row. This event is often used to cancel the updating operation.

SelectedIndexChanged

Occurs when a row's Select button is clicked, but after the GridView control handles the select operation. This event is often used to perform a task after a row is selected in the control.

SelectedIndexChanging

Occurs when a row's Select button is clicked, but before the GridView control handles the select operation. This event is often used to cancel the selection operation.

Sorted

Occurs when the hyperlink to sort a column is clicked, but after the GridView control handles the sort operation. This event is commonly used to perform a task after the user clicks on a hyperlink to sort a column.

Sorting

Occurs when the hyperlink to sort a column is clicked, but before the GridView control handles the sort operation. This event is often used to cancel the sorting operation or to perform a custom sorting routine.

Accessibility

The markup rendered by default for this control might not conform to accessibility standards such as the Web Content Accessibility Guidelines 1.0 (WCAG) priority 1 guidelines. For details about accessibility support for this control, see ASP.NET Controls and Accessibility.

TopicLocation
How to: Create ASP.NET Web Control Templates DeclarativelyBuilding ASP .NET Web Applications
How To: Create ASP.NET Web Server Control Templates DynamicallyBuilding ASP .NET Web Applications
How to: Set GridView Web Server Control Column Width DynamicallyBuilding ASP .NET Web Applications
How to: Bind to Data in a Templated ControlBuilding ASP .NET Web Applications
How to: Respond to Button Events in DataList, Repeater, or GridView ItemsBuilding ASP .NET Web Applications
How to: Create ASP.NET Web Server Control TemplatesBuilding ASP .NET Web Applications
How to: Create ASP.NET Web Control Templates DeclarativelyBuilding ASP .NET Web Applications
How To: Create ASP.NET Web Server Control Templates DynamicallyBuilding ASP .NET Web Applications
How to: Set GridView Web Server Control Column Width DynamicallyBuilding ASP .NET Web Applications
How to: Bind to Data in a Templated ControlBuilding ASP .NET Web Applications
How to: Respond to Button Events in DataList, Repeater, or GridView ItemsBuilding ASP .NET Web Applications
How to: Enable Default Deleting in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Simple Sorting for the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Data Binding Web Pages with a Visual Studio Data ComponentBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Editing and Inserting Data in Web Pages with the DetailsView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Customize Controls for Editing in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Creating and Using ASP.NET Master Pages in Visual Web DeveloperBuilding ASP .NET Web Applications in Visual Studio
How to: Connect to an Access Database Using the AccessDataSource Control (Visual Studio)Building ASP .NET Web Applications in Visual Studio
Walkthrough: Basic Data Access in Web PagesBuilding ASP .NET Web Applications in Visual Studio
How to: Enable Default Selection in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Create Web Server Control Templates Using the DesignerBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Creating a Web Page to Display XML DataBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Data Binding to a Custom Business ObjectBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Creating a Web Page to Display Access Database DataBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Displaying a Drop-Down List While Editing in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Performing Bulk Updates to Rows Bound to a GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Displaying Data Using a Stored Procedure in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Enable Default Editing in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Enable Default Paging in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Bind to Data in a Templated Control in Visual StudioBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Creating Master/Detail Web Pages in Visual StudioBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Creating a Nested GridView ControlBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Displaying an XML Document in a Web Forms Page Using TransformationsBuilding ASP .NET Web Applications in Visual Studio
Walkthrough: Displaying a Drop-Down List While Editing in the GridView Web Server ControlBuilding ASP .NET Web Applications in Visual Studio

The following code example demonstrates how use the GridView control to display the values from the Authors table of the Pubs sample database in Microsoft SQL Server. The values are retrieved using a SqlDataSource control.


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

<html>
  <body>
    <form runat="server">
        
      <h3>GridView Example</h3>

      <asp:gridview id="CustomersGridView" 
        datasourceid="CustomersSource" 
        autogeneratecolumns="true"
        emptydatatext="No data available." 
        allowpaging="true" 
        runat="server">                
      </asp:gridview>
            
      <!-- 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="CustomersSource"
        selectcommand="Select [CustomerID], [CompanyName], [Address], [City], [PostalCode], [Country] From [Customers]"
        connectionstring="<%$ ConnectionStrings:NorthWindConnectionString%>" 
        runat="server"/>
        
    </form>
  </body>
</html>


The following code example demonstrates how to use the GridView control to edit records.


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

<html>
  <body>
    <form runat="server">
        
      <h3>GridView Edit Example</h3>

      <!-- The GridView control automatically sets the columns     -->
      <!-- specified in the datakeynames property as read-only.    -->
      <!-- No input controls are rendered for these columns in     -->
      <!-- edit mode.                                              -->
      <asp:gridview id="CustomersGridView" 
        datasourceid="CustomersSqlDataSource" 
        autogeneratecolumns="true"
        autogeneratedeletebutton="true"
        autogenerateeditbutton="true"
        datakeynames="CustomerID"  
        runat="server">
      </asp:gridview>
            
      <!-- 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="CustomersSqlDataSource"  
        selectcommand="Select [CustomerID], [CompanyName], [Address], [City], [PostalCode], [Country] From [Customers]"
        updatecommand="Update Customers SET CompanyName=@CompanyName, Address=@Address, City=@City, PostalCode=@PostalCode, Country=@Country WHERE (CustomerID = @CustomerID)"
        deletecommand="Delete from Customers where CustomerID = @CustomerID"
        connectionstring="<%$ ConnectionStrings:NorthWindConnectionString%>"
        runat="server">
      </asp:sqldatasource>
            
    </form>
  </body>
</html>


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 2000 SP4, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter Edition

The .NET Framework does not support all versions of every platform. For a list of the supported versions, see System Requirements.

.NET Framework

Supported in: 2.0

Community Additions

ADD
Show:
© 2014 Microsoft