How to select a GridView row and persist selection across different pages of the GridView

Introduction

GridvIew control is a powerful data grid control that allows us to display the data in tabular format with sorting and pagination. It also allows us to manipulate the data.

Get hundreds of ASP.NET Tips and Tricks and ASP.NET Online training here.

To select a GridView record and persisit the selection across different pages of the GridView, we can follow this approach.

Below is my ASPX code.

<asp:GridView ID="GridView1" runat="server" AllowPaging="true" DataKeyNames="AutoId"
OnPageIndexChanging="PaginateTheData" PageSize="2" PagerSettings-Mode="Numeric"
SelectedRowStyle-BackColor="Yellow" AutoGenerateSelectButton="true" EnablePersistedSelection="true" />
<asp:Button ID="btnFind" runat="server" Text="Get Selected Record" OnClick="GetSelectedRecord" />

In the above code snippet, we have a GridView with pagination and AutoGenerateSelectButton=”true”
that generates the Select link column. Clicking the Select link selects the GridView row. After selecting a
record, by default when we move to another page, the selection is lost; so in order to persist the
selection while navigating to another pages, we can set the EnablePersistedSelection property to true. To uniquely identify each GridView row we have set DataKeyNames property of the GridView to the primary key of the database table from where we are getting the records.

CODE BEHIND

string _connStr = ConfigurationManager.ConnectionStrings["ConnStr"].ConnectionString;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindData();
}
}
/// <summary>
/// Binds the data.
/// </summary>
/// <returns></returns>
private void BindData()
{
DataTable table = new DataTable();
// get the connection
using (SqlConnection conn = new SqlConnection(_connStr))
{
// write the sql statement to execute
string sql = "SELECT AutoId, FirstName, LastName, Age, Active FROM PersonalDetail ORDER By AutoId";
// instantiate the command object to fire
using (SqlCommand cmd = new SqlCommand(sql, conn))
{
// get the adapter object and attach the command object to it
using (SqlDataAdapter ad = new SqlDataAdapter(cmd))
{
// fire Fill method to fetch the data and fill into DataTable
ad.Fill(table);
}
}
}
GridView1.DataSource = table;
GridView1.DataBind();
}
protected void PaginateTheData(object sender, GridViewPageEventArgs e)
{
GridView1.PageIndex = e.NewPageIndex;
this.BindData();
}
protected void GetSelectedRecord(object sender, EventArgs e)
{
var autoId = GridView1.SelectedDataKey.Value;
Response.Write("Selected record: " + autoId);
}

In the above code snippet, We get data from Database and attached to the GridView also we done the pagination for GridView data. To get the selected record, we need to access the SelectedDataKey property of the GridView. 

Notice that we have done that in the GetSelectedRecord method that fires on the click of the button. The output of the page in my case looks something similar to below image.

OUTPUT

In this case if we select a record in Page 3 and navigate to Page 4 and again come back to Page 3, previously selected record remains selected. Thanks to EnablePersistedSelection property of the GridView that has been introduced in latest version of ASP.NET.