Introduction
This article explains how to bind the data to a GridView with Image and Fileupload Controls using TemplateFields.
Description
A GridView is a databound control for displaying and manipulating data in web applications. A GridView displays data in tabular format, in other words a collection of rows and columns. Here each row represents one record and each column represents one field in a database table.
In a GridView each column is represented by one TemplateField, each TemplateField can contain a HeaderTemplate, ItemTemplate, EditItemTemplate and FooterTemplate.
- HeaderTemplate: It renders only once, used to display header text for a column.
 - ItemTemplate: It renders as many records/rows as are in the Datasource collection. Used to display data.
 - EditItemTemplate: It is allows you to edit the text.
 - FooterTemplate: It renders only once, used to display footer text. 
 
Frequently used Events
The following are frequently used events:
- OnRowEditing: It will be raised when button with CommandName=”Edit” is clicked.
 - OnRowUpdating: It will be raised when button with CommandName=”Update” is clicked.
 - OnRowDeleting: It will be raised when button with CommandName=”Delete” is clicked.
 - OnRowCanceling: It will be raised when button with CommandName=”Cancel” is clicked. 
 
The following is an example to show the GridView with Edit, Cancel, Update, Delete and Pagination using TemplateFields.
| Column Name | 
Data Type | 
| EmpId  | 
Int | 
| EmpName  | 
Varchar(50) | 
| EmpEmailId | 
Varchar(50) | 
| EmpMobileNum  | 
Bigint | 
| EmpImage  | 
Varchar(256) | 
Set the ConnectionString in web.config as in the following:
- <connectionStrings>  
 -     <add name="myconnection" connectionString="Data Source=ABHI-PC\SQLEXPRESS;Initial Catalog=Articles;Integrated Security=True"  
 - providerName="System.Data.SqlClient" />  
 - </connectionStrings>  
 
 Default.aspx
Default.aspx.cs
- using System;  
 - using System.Collections.Generic;  
 - using System.Linq;  
 - using System.Web;  
 - using System.Web.UI;  
 - using System.Web.UI.WebControls;  
 -   
 - using System.Data.SqlClient;  
 - using System.Data;  
 - using System.Web.Configuration;  
 -   
 - public partial class _Default: System.Web.UI.Page   
 - {  
 -     SqlConnection con = new SqlConnection(WebConfigurationManager.ConnectionStrings["connection1"].ConnectionString);  
 -     protected void Page_Load(object sender, EventArgs e)   
 -     {  
 -         if (!IsPostBack)  
 -         {  
 -             Bind();  
 -         }  
 -   
 -     }  
 -     public void Bind()   
 -     {  
 -         SqlCommand cmd = new SqlCommand("select * from Employee", con);  
 -         SqlDataAdapter da = new SqlDataAdapter(cmd);  
 -   
 -         DataSet ds = new DataSet();  
 -         da.Fill(ds, "Employee");  
 -   
 -         gv1.DataSource = ds;  
 -         gv1.DataBind();  
 -     }  
 -     protected void gv1_RowEditing(object sender, GridViewEditEventArgs e)   
 -     {  
 -         gv1.EditIndex = e.NewEditIndex;  
 -         Bind();  
 -     }  
 -     protected void gv1_RowUpdating(object sender, GridViewUpdateEventArgs e)   
 -     {  
 -         int index = e.RowIndex;  
 -   
 -         GridViewRow row = (GridViewRow) gv1.Rows[index];  
 -   
 -         Label eid = (Label) row.FindControl("lbleid");  
 -         TextBox ename = (TextBox) row.FindControl("txtename");  
 -         TextBox emid = (TextBox) row.FindControl("txtemid");  
 -         TextBox mnumber = (TextBox) row.FindControl("txtmnumber");  
 -   
 -         FileUpload fu = (FileUpload) row.FindControl("fu1");  
 -   
 -         if (fu.HasFile)  
 -         {  
 -   
 -             string file = System.IO.Path.Combine(Server.MapPath("~/Images/"), fu.FileName);  
 -             fu.SaveAs(file);  
 -   
 -             SqlCommand cmd = new SqlCommand("update Employee set EmpImage = '" + fu.FileName + "' where EmpId=" + Convert.ToInt32(eid.Text) + "", con);  
 -   
 -             con.Open();  
 -             int res = cmd.ExecuteNonQuery();  
 -             con.Close();  
 -         }  
 -   
 -         SqlCommand cmd1 = new SqlCommand("update Employee set EmpName='" + ename.Text + "',EmpEmailId='" + emid.Text + "',EmpMobileNum=" + Convert.ToInt64(mnumber.Text) + "", con);  
 -         con.Open();  
 -         int res1 = cmd1.ExecuteNonQuery();  
 -         con.Close();  
 -   
 -         if (res1 == 1)   
 -         {  
 -             Response.Write("<script>alert('Updation done!')</script>");  
 -         }  
 -         gv1.EditIndex = -1;  
 -         Bind();  
 -     }  
 -     protected void gv1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)   
 -     {  
 -         gv1.EditIndex = -1;  
 -         Bind();  
 -     }  
 -     protected void gv1_RowDeleting(object sender, GridViewDeleteEventArgs e)   
 -     {  
 -         int index = e.RowIndex;  
 -   
 -         GridViewRow row = (GridViewRow) gv1.Rows[index];  
 -   
 -         Label eid = (Label) row.FindControl("lbleid");  
 -   
 -         SqlCommand cmd = new SqlCommand("delete from Employee where EmpId=" + Convert.ToInt32(eid.Text) + "", con);  
 -         con.Open();  
 -         int res = cmd.ExecuteNonQuery();  
 -         con.Close();  
 -   
 -         if (res == 1)   
 -         {  
 -             Response.Write("<script>alert('Deletion done!')</script>");  
 -         }  
 -         Bind();  
 -     }  
 -     protected void gv1_PageIndexChanging(object sender, GridViewPageEventArgs e)   
 -     {  
 -         gv1.PageIndex = e.NewPageIndex;  
 -         Bind();  
 -     }  
 - }  
 
 
Output