Summarize data binding _ practical tips in ASP.net templated controls under Visual Studio

Binding to data in a templated control
FormView, DataList, Repeater, and ListView Web server controls use templates to display data and retrieve user input to insert, update, or delete data. In addition, you can use templates with the GridView and DetailsView controls to customize the data layout.
You can bind a templated control to a data source control (such as a LinqDataSource, ObjectDataSource, or SqlDataSource control) by setting the DataSourceID property of the templated control to the ID of the data source control. You can then use the Eval and bind functions in the template to bind to data in the data source. For more information, see Data-binding expression syntax.
To bind a control to data by using a template
1. Add a data source control (such as a SqlDataSource control) to the page, as shown in the following example:

<asp:sqldatasource id= "SqlDataSource1" 
 selectcommand= "SELECT * FROM [Products]"
 connectionstring= "<% $ connectionstrings:northwindconnection%> "
 runat=" server >
</asp:SqlDataSource>

2. Add a control that supports the template, such as the ASP.net FormView control.
3. Set the DataSourceID property of the templated control to the ID of the data source control in step 1, as shown in the example:

<asp:formview id= "FormView1"
 datasourceid= "SqlDataSource1" datakeynames= "ProductID"   
 Server >
</asp:FormView>

4. Add templates to templated controls and populate them with controls and tags.
5. To display data, use the Eval function as a property setting and reference the bound data field. In the template used to insert or edit data, use the BIND function to reference the data-bound field, as shown in the following example:

<asp:formview id= "FormView1" datasourceid= "SqlDataSource1" datakeynames= "ProductID" runat= "Server" > <ite mtemplate> <table> <tr><td align= "right" ><b>product id:</b></td> <td> <%# Eval ("ProductID")%></td></tr> <tr><td align= "right" ><b>product Name:</b ></td> <td><%# Eval ("ProductName")%></td></tr> <tr><td align= "right" > <b>category id:</b></td> <td><%# Eval ("CategoryID")%></td></tr> <tr& GT;&LT;TD align= ' right ' ><b>quantity per unit:</b></td><td><%# Eval ("QuantityPerUnit" )%></td></tr> <tr><td align= "right" ><b>unit price:</b></td> <td&gt ; <%# Eval ("UnitPrice")%></td></tr> </table> </ItemTemplate> </asp:f

 Ormview>

Each WEB server control supports a different template. For example, the Repeater control supports a ItemTemplate and a alternatingitemtemplate to display data using alternating controls, styles, and tags.

Data in a templated control that is bound to Visual Studio
You can associate a control (such as a GridView, DetailsView, FormView, ListView, DataList, or Repeater control) with a data source control such as LinqDataSource, ObjectDataSource or SqlDataSource control). You can also use the templates of the controls (ListView, DataList, Repeater, and FormView controls require templates) to customize the data representation in the designer through a custom user interface (UI).
This topic demonstrates how to add a user interface control, such as a TextBox control, to a template and bind the control to specific data.
To bind a template control to a data source
1. Establish a valid data source (such as a SqlDataSource control) on the page and note the ID attribute value.
For example:

<asp:sqldatasource id= "SqlDataSource1" runat= "Server" 
 selectcommand= "select CustomerID, CompanyName from Customers "
 connectionstring=" <%$ 
  connectionstrings:northwindconnectionstring%> ">
</asp :sqldatasource>

For more information about how to use the SqlDataSource control with a database, see SqlDataSource WEB Server Control Overview.
2. From the Data group in the Toolbox, drag the DataList control onto the page.
The DataList task shortcut menu appears.
If the DataList task shortcut menu does not appear, right-click the DataList control, and then click Show Smart Tags.
3. In the Select Data Source list, click the SqlDataSource control that you created in step 1.
When the page is rendered, the control displays all columns and data from a query that is not customized. Depending on the data, the DataList control displayed will have a default bound field, as shown in the following code example:

<asp:datalist id= "DataList1" runat= "Server" datakeyfield= "CustomerID" datasourceid= "SqlDataSource1" 
  >
 <ItemTemplate>
  CustomerID:
  <asp:label id= "Customeridlabel" runat= "Server" 
    text= " <%# Eval ("CustomerID")%> ' >
  </asp:label><br/> CompanyName
  :
  <asp:label id= ' Companynamelabel "runat=" server " 
    text= ' <%# Eval (" CompanyName ")%> ' >
  </asp:label><br/ >
  <br/>
 </ItemTemplate>
</asp:DataList>

Edit the control's template
1. In Design view, right-click the DataList control, and then click Show Smart Tags.
2. On the DataList Task menu, click Edit Template.
You can now edit the template in the designer. You can drag other controls onto the template for later binding.
3. In the display list, click AlternatingItemTemplate (different controls support different templates).
4. Type CustomerID in the AlternatingItemTemplate design space:, and then drag a T:System.Web.UI.WebControls.Label control from the standard group in the Toolbox to DataList the control.
5. On the Label Task menu, click Edit Data Binding.
6. In the Label name Data Binding dialog box, under Bindable properties, click Text.
7. Under Binding to text in the Bind to list, click CustomerID.
8. Repeat steps 4th through 7th for CompanyName.
9. In the "AlternatingItemTemplate" Design space, select all content and press Ctrl+b to change the text to bold.
10. Right-click the DataList control, and then click Show Smart Tags.
11. Click End Template Edit to exit template editing mode.
When the page is displayed in a browser, the list of companies is alternately displayed as plain text and bold text.