reate Templatefields in a GridView control

Create Templatefields in a GridView control

We use TemplateFields when we wish to display ASP.Net controls in a GridView column. We display ASP.Net controls in a GridView column to provide additional functionality in the user interface. For example, by placing a DropDownList control in a GridView column, users will be able to select a list of options from within the Gridview control interface. Other examples of providing more functionality to the GridView interface are placing Checkboxes, Labels, Textboxes and Validation controls. A Template field supports many types of templates and a list of template types is given in the table below. 

TemplateType	Description
AlternatingItemTemplate	The contents of this template are displayed for every other row rendered by the GridView
EditItemTemplate	The contents of this template are displayed when a row is selected for editing
FooterTemplate	The contents of this template are displayed in the column footer
HeaderTemplate	The contents of this template are displayed in the column header
InsertTemplate	The contents of this template are displayed when a new data item is inserted
ItemTemplate	The contents of this template are displayed for every row rendered by the GridView

We can create TemplateFields in the GridView control using <TemplateField> element. 

Steps to create the <TemplateField> element in the GridView control 

a. Declare the GridView and set the AutoGenerateColumns property to 'false'. 
b. Create a Template column using <asp:TemplateField> tag within the <Columns> element.
c. Create <ItemTemplate> within the <asp:TemplateField> element to display value of field as text.
d. Create <EditItemTemplate> to display TextBox control to modify value of field when editing the record.

<asp:GridView ID="GridView1"  DataSourceId="MyDataSource"  DataKeyNames="Code"

AutoGenerateColumns="false"       AutoGenerateEditButton="true"

AutoGenerateDeleteButton="true"   runat="server">

<Columns>

<asp:TemplateField  HeaderText="Name">

<ItemTemplate>

<%#Eval("Name")%>

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox ID="txtName" Text="<%# Bind("Name")%>" runat="server" />

</EditItemTemplate>

</asp:TemplateField>

<asp:TemplateField  HeaderText="Description">

<ItemTemplate>

<%#Eval("Description")%>

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox ID="txtDesctiption"     Text="<%# Bind("Description")%>"  runat="server" />

</EditItemTemplate>

</asp:TemplateField>

</Columns>

</asp:GridView>

<asp:SqlDataSource ID="MyDataSource" 

ConnectionString="<%$Connectionstrings:ERPConnectionString%>"

SelectCommand="SELECT * FROM Sample"

UpdateCommand="Update SAMPLE SET Name=@Name,Description=@Description Where Code=@Code"

DeleteCommand="Delete SAMPLE Where Code=@Code" runat="server"/>

Configure the SqlDataSource control and set the SelectCommand and UpdateCommand properties to display and update records from the Sample Table. 

Observe that we have created two Template fields the GridView control. The first TemplateField is used to display and edit the value of the 'Name' field in the SAMPLE table. The second TemplateField is used to display and edit the value of the 'Description' field in the SAMPLE table. The contents of the ItemTemplate are displayed when a row is in normal mode and the contents of the EditItemTemplate are displayed when a row is in edit mode. 

Difference between BoundField and TemplateField?

Bound field

By  using bound field we can bind the data directly by using header text and datafield with out using any controls.

Headertext : we can specify header for the data

Datafield : Its the field which gets the data from dataset.

Example : if we specify a field name in datafield it searches in dataset with the same column name and binds the data.

we can define our own asp controls in bound field column only thing we can do is only binding the data.

Template field

We can define our own asp controls in template field.

and we can bind the data from dataset to template field columns directly.

 Difference Between Eval() and Bind() methods in ASP.NET.

Bind(): Bind method used when user can modify the value i.e for edit/update. Bind is a 2 way of   databinding i.e. bi-directional databinding.
Eval(): Eval is one way Binding i.e. it is like read only.
Suppose we have a gridview control and want to only display the data, not perform any other action then we can use Eval() to bind the data.
If we want to edit the information in the gridview then we use Bind().

<asp:TemplateField HeaderText="Name">
    <EditItemTemplate>
    <asp:TextBox ID="txtName" Text='<%# Bind("Name")%>' runat="server">
     </asp:TextBox>
    </EditItemTemplate>
</asp: TemplateField>
<asp:TemplateField HeaderText="User Id">
    <ItemTemplate>
    <asp:Label ID="lblUserId" Text='<%# Eval("UserId") %>' runat="server">
    </ItemTemplate>
    </asp:TemplateField>
</asp: TemplateField>

In this example we want to edit the Name and userId is only for display.