How to: Enable Default Selection in the GridView Web Server Control
The ASP.NET GridView control has a built-in selection capability that allows users to select a row in the grid. Selecting a row in a GridView control does not inherently perform any task. However, by adding selection capability, you can add functionality to the grid that relies on users pointing to a specific row. Typical uses for adding selection capability to the GridView control include the following:
When users select a row, the row is redisplayed with a different look.
When users select a row, related data is displayed elsewhere in the page, such as in a DetailsView control.
To access the selected row, use the SelectedRow property.
To perform custom actions when a user selects a row, provide a handler for the SelectedIndexChanging event.
To enable selection using the smart tag
In Design view, right-click the GridView control and click Show Smart Tag.
In the smart tag panel, select Enable Selection.
To enable default selection using the AutoGenerateSelectButton property
Select the GridView control, and in the Properties window, set AutoGenerateSelectButton to true.
-or-
In Source view, in the <asp:GridView> element, set the AutoGenerateSelectButton attribute to true:
<asp:GridView Runat="server" ID="GridView1" AutoGenerateSelectButton="true" />
To customize the look of a row in selection mode
Set properties for the SelectedRowStyle.
For example, if you set the BackColor subproperty of the SelectedRowStyle to gray, a selected row is displayed with a gray background.
To customize the command text of the Select button
In Design view, right-click the GridView control and click Show Smart Tag.
Click Edit Columns.
The Fields dialog box is displayed.
Under Selected fields, click Select.
The field properties are loaded into the properties grid.
Under CommandField properties, enter text for the Select button in the SelectText property.
To change the command text of the Select button to an image
In Design view, right-click the GridView control and click Show Smart Tag.
Click Edit Columns.
The Fields dialog box is displayed.
Under Selected fields, click Select.
The field properties are loaded into the properties grid.
Under CommandField properties, enter or select the URL of the image to use for the Select button in the SelectImageUrl field.
Under CommandField properties, select Image in the ButtonType field.
Click OK.
To display the selected row in a DetailsView control
Copy the data source control that is bound to the GridView control and paste a copy of the data source control onto the page.
In Design view, right-click the data source control and click Show Smart Tag.
Click Configure Data Source….
Check that the Which data connection should your application use to connect to the database? field is set to the same connection as the one used by the GridView control.
Click Next.
Select the Specify columns from a table or view option.
In the Name drop-down list verify that the same table that is bound to the GridView control is selected.
Under Columns, select the table columns to display in the DetailsView control.
Click the WHERE… button.
The Add WHERE Clause window opens.
In the Column drop-down list, select the column name to use in the WHERE clause. This column should be a primary key for the table or contain only unique values to identify the row selected.
In the Source drop-down list, select Control.
In the Control ID drop-down list, select the ID of the GridView control.
Click Add.
Click OK, then click Next, and then click Finish.
Right-click the DetailsView control and click Show Smart Tag.
In the Choose Data Source drop-down list, select the data source control you just configured.
See Also
Concepts
Modifying Data in a GridView Web Server Control