Article: How to bind DataGrid using Template Column?

Article Detail

Posted by:

 

Date:

Thursday, August 17, 2006 (CST)

 
Screen Shots



Article Brief Description

This step-by-step article describes how to bind DataGrid using Template Column

Article Detail Description

Summary:
This step-by-step article describes how to bind DataGrid using Template Column

 

Requirements:

The following list are required to run the attached example:

 

Microsoft Windows XP Professional,Windows 2000 Professional,
Microsoft Visual Studio .NET 2003
SQL Server 2000/2005 or change the connection string to connect to Access Northwind database

 

Create a ASP.NET C# Project

Create ASP.NETforms: default.aspx

 

On default form add datagrid called grdEmployees, lable for error message called lblError,
lable for header message called lblHeader

 

On default.aspx file put the datadrid inside

 

<asp:DataGrid id="grdEmployees" style="Z-INDEX: 100; LEFT: 240px; POSITION: absolute; TOP: 160px"
 runat="server" Width="440px" BackColor="White" ForeColor="Black" BorderColor="#CCCCCC" BorderStyle="None"
 BorderWidth="1px" CellPadding="4" GridLines="Horizontal" AutoGenerateColumns="False">
 <FooterStyle ForeColor="Black" BackColor="#CCCC99"></FooterStyle>
 <SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#CC3333"></SelectedItemStyle>
 <HeaderStyle Font-Bold="True" ForeColor="White" BackColor="#333333"></HeaderStyle>
 <Columns>
  <asp:TemplateColumn>
   <HeaderTemplate>
    <TABLE id="Table3">
     <TR>
      <TD>Employee ID</TD>
      <TD>First Name</TD>
      <TD>Last Name</TD>
      <TD>Address</TD>
      <TD>City</TD>
     </TR>
    </TABLE>
   </HeaderTemplate>
   <ItemTemplate>
    <TABLE id="Table1">
     <TR>
      <TD><%# DataBinder.Eval(Container.DataItem, "EmployeeID") %></TD>
      <TD><%# DataBinder.Eval(Container.DataItem, "FirstName") %></TD>
      <TD><%# DataBinder.Eval(Container.DataItem, "LastName") %></TD>
      <TD><%# DataBinder.Eval(Container.DataItem, "Address") %></TD>
      <TD><%# DataBinder.Eval(Container.DataItem, "City") %></TD>
     </TR>
    </TABLE>
   </ItemTemplate>
  </asp:TemplateColumn>
 </Columns>
 <PagerStyle HorizontalAlign="Right" ForeColor="Black" BackColor="White"></PagerStyle>
</asp:DataGrid>

 

 

On web.config add connection string

 

<appSettings>
    <add key="strConn" value="Data Source=localhost;Initial Catalog= Northwind;Trusted_Connection=false;User Id=ahsan;Password=password;"/>
</appSettings>

 

 

On default.aspx.cs write function for binding the grid

 

private void BindGrid()
{
 lblError.Visible = false;
 string connString = ConfigurationSettings.AppSettings["strConn"];
 // Create a connection to the database
 SqlConnection conn = new SqlConnection(connString);
 // Create a command that will get the records from the database
 SqlCommand cmd = new SqlCommand("Select EmployeeID, Firstname,LastName,Address,City from Employees", conn);
 // Create a data adapter that will be used to fill a data set with the
 // data returned from the database.
 SqlDataAdapter da = new SqlDataAdapter(cmd);
 // Create a data set the will hold the results from the database.
 DataSet ds = new DataSet();
 try
 {
  // Fill the data set with the command results
  da.Fill(ds);
  StringBuilder strTempColumn = new StringBuilder();
  grdEmployees.DataSource = ds;
  grdEmployees.DataBind();
 }
 catch (Exception ex)
 {
  // Display the error message to the user
  lblError.Visible = true;
  lblError.ForeColor= Color.Red;
  lblError.Text = ex.Message;
 }
 finally
 {
  // Close the connection
  conn.Close();
 }
}

 

 

Test the application:

 

Press F5 to compile and to run the application.
Page will show the grid get populated with data with a vertical scroll bar
If the connection fails error message will display.

 

Download:

 

Click below link to download the source code


 

Ferotech Solution Services Inc.