Click here to Skip to main content
15,870,297 members
Articles / Web Development / ASP.NET

Accessing a DropDownList inside a GridView

Rate me:
Please Sign up or sign in to vote.
3.33/5 (12 votes)
28 Oct 2010CPOL2 min read 172.2K   3.8K   14   10
Accessing a DropDownList and its events inside a GridView

Introduction

This article demonstrates how to bind a DropDownList inside a GridView, and also shows how to bind a TextBox inside a GridView on the SelectedIndexChanged event of the DropDownList.

Using the Code

To start with, add the GridView control to your page, add the bound columns if any, then add two template columns: one for the DropDownList and one for the TextBox. Set the AutoPostBack property to "True" for the DropDownList, and create the SelectedIndexChanged event.

The ASPX code will look like:

ASP.NET
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" 
  OnRowCommand="GridView1_RowCommand" OnRowDataBound="GridView1_RowDataBound">

<Columns>
<asp:BoundField DataField="CustomerID" HeaderText="Customer ID" />
<asp:BoundField DataField="CustomerName" HeaderText="Customer Name"/>
<asp:TemplateField HeaderText="Sample Dropdown">
<ItemTemplate>
<asp:DropDownList Width="50" runat="server" 
   id="ddlTest" AutoPostBack="true" 
   OnSelectedIndexChanged="ddlTest_SelectedIndexChanged">
</asp:DropDownList> 
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Sample Textbox">
<ItemTemplate>
<asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField> 
</Columns>
</asp:GridView>

Let's move on to the code-behind.

The first thing to do is to bind the gird with some sample data. For the sake of simplicity, I am binding the sample data to the grid. For this, I am creating an object of the Customer class, assigning its properties with dummy data, and adding it to the list. Here is the code for this:

C#
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        //Creating object of the list.
        List lst = new List();
        //Creating object of the Customer class
        Customer cust1 = new Customer();
        //Assigning properties with Dummy data
        cust1.CustomerID = 1;
        cust1.CustomerName = "Customer1";
        Customer cust2 = new Customer();
        cust2.CustomerID = 2;
        cust2.CustomerName = "Customer2";
        Customer cust3 = new Customer();
        cust3.CustomerID = 3;
        cust3.CustomerName = "Customer3";
        //Adding Customer objects in the list.
        lst.Add(cust1);
        lst.Add(cust2);
        lst.Add(cust3);
        //Assigning the list to the Grid.
        GridView1.DataSource = lst;
        GridView1.DataBind();
    }
}

The second step is to bind the DropDownList with data. To achieve this, we have to use the RowDataBound event of the GridView. This event fires when we bind the data to the GridView. In this event, we need to find the DropDownList control of each row and bind it with some data. Again, for the sake of simplicity, I am binding it with dummy data by creating an object of the dummy class called "DropDownData" and adding these objects to the list, and finally, assigning this list as a datasource to the DropDownList:

C#
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    //Checking whether the Row is Data Row
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        //Finding the Dropdown control.
        Control ctrl = e.Row.FindControl("ddlTest");
        if (ctrl != null)
        {
            DropDownList dd = ctrl as DropDownList;
            //Binding the Dropdown with Dummy data.
            List lst = new List();
            DropDownData cust1 = new DropDownData(1, "One");
            DropDownData cust2 = new DropDownData(2, "Two");
            lst.Add(cust1);
            lst.Add(cust2);
            dd.DataTextField = "Text";
            dd.DataValueField = "ID";
            dd.DataSource = lst;
            dd.DataBind();
        }
    }
}

The third and most important step is to handle the SelectedIndexChanged event of the DropDownList. As we have to identify the exact Row of the GridView from where the SelectedIndexChanged event is fired, we need to compare the "ClientID" of the DropDownList with the dropdowns available in all the rows of the GridView. Once the CliendID is matched, we can bind the TextBox with some data of that Row. For simplicity, I am binding the DropDownList's SelectedValue data. You can fire a database query to get real data as well. Here is the code:

C#
protected void ddlTest_SelectedIndexChanged(object sender, EventArgs e))
{
   //Casting sender to Dropdown
   DropDownList ddl = sender as DropDownList;
   //Looping through each Gridview row to find exact Row 
   //of the Grid from where the SelectedIndex change event is fired.
   foreach (GridViewRow row in GridView1.Rows)
   {
      //Finding Dropdown control  
      Control ctrl = row.FindControl("ddlTest") as DropDownList;
        if (ctrl != null)
        {
            DropDownList ddl1 = (DropDownList)ctrl;
            //Comparing ClientID of the dropdown with sender
            if (ddl.ClientID == ddl1.ClientID)
            {
                //ClientID is match so find the Textbox 
                //control bind it with some dropdown data.
                TextBox txt = row.FindControl("txtTest") as TextBox;
                txt.Text = ddl1.SelectedValue;
                break;
            }
        }
   }
}

Sample Classes

C#
public class DropDownData
{
    public DropDownData(int id, string displaytext)
    {
        iD = id;
        text = displaytext;
    }
    int iD;
    public int ID
    {
        get { return iD; }
        set { iD = value; }
    }
    string text;
    public string Text
    {
        get { return text; }
        set { text = value; }
    }
}

public class Customer
{
    public int CustomerID
    {
        get;
        set;
    }

    public string CustomerName
    {
        get;
        set;
    }
}

That's it...

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Systems Engineer
India India
I am from India, working as Sr. System Engineer in one of the reputed IT firm, having extensive experience on Asp.net, C#, Ajax.

Comments and Discussions

 
QuestionBind Data with null value from database in dropdownlist GridView Pin
Member 106168647-Apr-17 0:13
Member 106168647-Apr-17 0:13 
Questionwhen multiple dropdown and eqlly textbox Pin
Omprakash Kukana23-Sep-13 20:38
Omprakash Kukana23-Sep-13 20:38 
QuestionThank you , Thank you , Thank you Pin
Member 276667218-Jul-12 4:58
Member 276667218-Jul-12 4:58 
Questionif you use... Pin
Lucio Flavio22-Sep-11 7:30
Lucio Flavio22-Sep-11 7:30 
GeneralMy vote of 1 Pin
Daniel Nutu3-Nov-10 4:31
Daniel Nutu3-Nov-10 4:31 
GeneralDataBinding error. Pin
Luck)27-Oct-10 17:56
Luck)27-Oct-10 17:56 
GeneralRe: DataBinding error. Pin
Ravindra Nidhonkar27-Oct-10 21:17
Ravindra Nidhonkar27-Oct-10 21:17 
General[My vote of 1] Not enough information Pin
Richard MacCutchan20-Jan-10 23:01
mveRichard MacCutchan20-Jan-10 23:01 
GeneralRe: [My vote of 1] Not enough information Pin
Ravindra Nidhonkar21-Jan-10 2:27
Ravindra Nidhonkar21-Jan-10 2:27 
GeneralRe: [My vote of 1] Not enough information Pin
Richard MacCutchan21-Jan-10 4:46
mveRichard MacCutchan21-Jan-10 4:46 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.