Accessing Different Controls inside the Datagrid
Introduction:
Every now and then I get emails saying that how
can we get value from a textbox that is inside a datagrid?. When I answer that
the next question is how do we get values from a textarea inside a datagrid
control? In this article I will show you how you can get values out of different
controls that are inside the datagrid control.
User Interface:
Since this Datagrid will contain different
controls in each column hence it will look something like this:
As you can see the datagrid looks ugly :) but
the purpose of this article is to show you that how you can retrieve values of
different controls inside the datagrid. Here are the column details:
Column 0 = TextBox
Column 1 = Listbox
Column 2 = DropDownList
Column 4 = CheckBox
You must be wondering that how I populated the
controls. So let's see some code:
BindData method:
We used a very simple BindData method which is
called by each controls and hence each control is populated. Here is the page
load event.
| private
void Page_Load(object
sender, System.EventArgs e) {
myDataGrid.DataSource = BindData();
myDataGrid.DataBind();
} |
The page load event simply calls the BindData
method which is the heart and soul for this application.
| public
DataSet BindData()
{
Database db = DatabaseFactory.CreateDatabase();
DBCommandWrapper selectCommandWrapper =
db.GetSqlStringCommandWrapper("SELECT * FROM Articles");
return
db.ExecuteDataSet(selectCommandWrapper);
} |
I said before that BindData method is heart and
soul but I forgot to mention that its also very simple :). I am using Microsoft
Enterprise Library to access the data from the database. You can use whatever
method you find suitable for you. The only thing to remember about this method
is that it returns a dataset object which will later be assigned to the controls
inside the datagrid.
Binding the data to the controls:
Now let's see that how we have populated the
controls inside the datagrid.
<asp:DataGrid id="myDataGrid"
runat="server" AutoGenerateColumns="False" Width="360px" Height="120px">
<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<asp:TextBox text= '<%# DataBinder.Eval(Container.DataItem,"Title") %>'
id="TextBox1" runat="server">
</asp:TextBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemTemplate>
<asp:ListBox DataSource="<%# BindData() %>" DataTextField="Abstract"
DataValueField ="Abstract" id="ListBox1" runat="server">
</asp:ListBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemTemplate>
<asp:DropDownList DataSource="<%# BindData() %>" DataTextField="DateCreated"
DataValueField="DateCreated" id="DropDownList1" runat="server"></asp:DropDownList>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemTemplate>
<asp:CheckBox id="CheckBox1" runat="server"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid> |
Don't be scared by looking at all the
code above. Most of the code is automatically generated. I have made the lines
bold which are important. As you can see that we are pretty much doing the same
stuff on every control inside the datagrid. We assign BindData method as a
datasource and than set the text of the controls and finally we set the value of
the control.
Now comes the fun part since we already have
populated the datagrid embedded controls with come data we can extract those
values. You can use any type of event to extract the values, I will be using a
simple button click controls to display values from different rows. Let's see
the code in small pieces.
First we made the StringBuilder object. In
order to use StringBuilder object you need to include the namespace using
System.Text.
| StringBuilder str = new
StringBuilder(); |
The code below extracts the values from the
controls. We are using a simple foreach loop that goes through the datagrid rows
and gets the values of the controls.
| foreach(DataGridItem
dgi in
myDataGrid.Items)
{
TextBox myTextBox = (TextBox)
(dgi.Cells[0].Controls[1]);
ListBox myListBox = (ListBox)
(dgi.Cells[1].Controls[1]);
DropDownList myList = (DropDownList)
(dgi.Cells[2].Controls[1]);
CheckBox myCheckBox = (CheckBox)
(dgi.Cells[3].Controls[1]);
str.Append(myTextBox.Text);
string
a = myListBox.SelectedValue;
if(a
!= null
&& a != "")
{
str.Append(myListBox.SelectedItem.Text);
}
str.Append(myList.SelectedItem.Text);
str.Append(myCheckBox.Checked);
}
|
As I said before TextBox is the column number 0
that's why we are using dgi.Cells[0]. For ListBox we are using dgi.Cells[1] and
so on.
| string
a = myListBox.SelectedValue;
if(a
!= null
&& a != "")
{
str.Append(myListBox.SelectedItem.Text);
} |
The above 4 lines are very important in order to get the values from the ListBox control. Always remember to extract the value of the selected ListBox item and assign to a string variable and than check for null or empty values.
Basically that's all there is to do. Finally when you press the button all the data that you have selected is printed out on the screen. If you want to select the rows and not the whole datagrid items than you can easily use the "select" column of the datagrid and use the same technique to access the row items.
I hope you liked the article, Happy programming !
Attachments:
Project Files: DataGrid_different_values.zip