Autogenerate Select button and SelectedIndexChanging Event in GridView Asp.NET

In my previous blog, I have shown How to Bind Data in Gridview. In this article, I am going to show How to use SelectedIndexChanging Event for Selecting data from Gridview and displaying it in TextBox.

Let's Begin:
Set AutoGenerateSelectButton property of Gridview to true and add SelectedIndexChanging Event of Gridview. Drop 4 TextBox from the toolbox for displaying the value from the GridView on Clicking the select button in Gridview.

Default.aspx Code:

<form id="form1" runat="server">     <div>         <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" CellPadding="4" AutoGenerateSelectButton="true" OnSelectedIndexChanging="GridView1_SelectedIndexChanged1">             <Columns>                 <asp:BoundField DataField="Id" HeaderText="Emp ID"/>                 <asp:BoundField DataField="First Name" HeaderText="First Name"/>                 <asp:BoundField DataField="Last Name" HeaderText="Last Name"/>                 <asp:BoundField DataField="City" HeaderText="City"/>             </Columns>             <HeaderStyle BackColor="#663300" ForeColor="#ffffff"/>             <RowStyle BackColor="#e7ceb6"/>         </asp:GridView>         <br />         <br />         <div style="border:1px solid black; width:336px;">             <table class="auto-style1">                 <tr>                     <td class="auto-style5">Emp ID</td>                     <td class="auto-style3">                         <asp:TextBox ID="txt_ID" runat="server" ReadOnly="True"></asp:TextBox>                     </td>                 </tr>                 <tr>                     <td class="auto-style2">First Name</td>                     <td class="auto-style4">                         <asp:TextBox ID="txt_FN" runat="server"></asp:TextBox>                     </td>                 </tr>                 <tr>                     <td class="auto-style5">Last Name</td>                     <td class="auto-style3">                         <asp:TextBox ID="txt_LN" runat="server"></asp:TextBox>                     </td>                 </tr>                 <tr>                     <td class="auto-style2">City</td>                     <td class="auto-style4">                         <asp:TextBox ID="txt_CT" runat="server"></asp:TextBox>                     </td>                 </tr>                 <tr>                     <td class="auto-style5">&nbsp;</td>                     <td class="auto-style3">                         <asp:Button ID="Button1" runat="server" Text="Update" />                     </td>                 </tr>             </table>         </div>     </div> </form>

SelectedIndexChanging event occurs before the GridView control performs the select operation so, the SelectedIndex property of the control cannot be used to determine the index of the new row selected by the user. To determine the index of the new row selected by the user, use the NewSelectedIndex property and display the value in TextBox.

Default.aspx.cs Code:

using System; using System.Web.UI.WebControls; using System.Data; using System.Data.SqlClient; using System.Configuration; public partial class _Default : System.Web.UI.Page {     protected void Page_Load(object sender, EventArgs e)     {         if(!IsPostBack)         {             DisplayData();         }     }     protected void DisplayData()     {         DataTable dt = new DataTable();         SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString);         SqlDataAdapter adapt = new SqlDataAdapter("select * from Employee",con);         con.Open();         adapt.Fill(dt);         con.Close();         if(dt.Rows.Count>0)         {             GridView1.DataSource = dt;             GridView1.DataBind();         }     }     protected void GridView1_SelectedIndexChanged1(object sender, GridViewSelectEventArgs e)     {         txt_ID.Text = GridView1.Rows[e.NewSelectedIndex].Cells[1].Text;         txt_FN.Text = GridView1.Rows[e.NewSelectedIndex].Cells[2].Text;         txt_LN.Text = GridView1.Rows[e.NewSelectedIndex].Cells[3].Text;         txt_CT.Text = GridView1.Rows[e.NewSelectedIndex].Cells[4].Text;     } }

Final Preview:

Hope you Like it. Thanks.

[Download Source Code via Google Drive]