A DataGrid Demo Using Templates

This demo illustrates how to use templates in a DataGrid Web control. Templates allow a much higher degree of HTML output customization than the default DataGrid output or the output from BoundColumns. While this demo may not be extremely pretty, it (hopefully) illustrates that the TemplateColumn allows for a high degree of HTML customization, much more so than the BoundColumn.

FAQ IDFAQ Information
181
Description: How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency.
Category Name: ASP.NET
View Count: 901,232
161
Description: How can I convert a Recordset into an array? Also, how can I convert an array into a Recordset?
Category Name: Arrays
View Count: 219,334
115
Description: I am using Access and getting a 80004005 error (or a [Microsoft][ODBC Microsoft Access Driver] The Microsoft Jet database engine cannot open the file '(unknown)' error) when trying to open a connection! How can I fix this problem?
Category Name: Databases, Errors
View Count: 217,694
83
Description: How can I quickly sort a VBScript array?
Category Name: Arrays
View Count: 212,145
190
Description: How do I display data on a web page using arrays instead of Do...While...MoveNext...???...
Category Name: Arrays
View Count: 168,093
106
Description: How can I find out if a record already exists in a database? If it doesn't, I want to add it.
Category Name: Databases, Queries
View Count: 167,513
118
Description: When I get a list of all files in a directory via the FileSystemObject, they aren't ordered in any reasonable way. How can I sort the files by name? Or by size? Or by date created? Or...
Category Name: FileSystemObject
View Count: 151,850
30
Description: For session variables to work, must the Web visitor have cookies enabled?
Category Name: Session Object
View Count: 118,141
14
Description: Can I send emails without using CDONTS?
Category Name: Email
View Count: 115,089
153
Description: How can I take the result of a SELECT...MULTIPLE or a group of same-named checkboxes and turn it into a query? That is, if the user selects 3 answers, how can I construct a query that looks for all 3?
Category Name: Databases, Queries
View Count: 113,621

Source Code 
<% @Import Namespace="System.Data" %>
<% @Import Namespace="System.Data.SqlClient" %>
<script language="vb" runat="server">
  Sub Page_Load(sender as Object, e as EventArgs)
    BindData()
  End Sub
	
	
  Sub BindData()
    '1. Create a connection
    Dim myConnection as New SqlConnection(ConfigurationSettings.AppSettings("connectionString"))

    '2. Create the command object, passing in the SQL string
    Const strSQL as String = "sp_Popularity"
    Dim myCommand as New SqlCommand(strSQL, myConnection)

    'Set the datagrid's datasource to the datareader and databind
    myConnection.Open()
    dgPopularFAQs.DataSource = myCommand.ExecuteReader(CommandBehavior.CloseConnection)
    dgPopularFAQs.DataBind()	
  End Sub
</script>


    <asp:datagrid id="dgPopularFAQs" runat="server"
		AutoGenerateColumns="False"
		HeaderStyle-HorizontalAlign="Center"
		HeaderStyle-BackColor="Red"
		HeaderStyle-ForeColor="White"
		HeaderStyle-Font-Bold="True"
		HeaderStyle-Font-Name="Verdana"
		AlternatingItemStyle-BackColor="#dddddd"
		ItemStyle-Font-Name="Verdana">
	
	  <Columns>
	    <asp:BoundColumn DataField="FAQID" ItemStyle-Width="10%" 
				ItemStyle-HorizontalAlign="Center" HeaderText="FAQ ID" />
	    
	    <asp:TemplateColumn HeaderText="FAQ Information">
	      <ItemTemplate>
	        <table border="0">
	          <tr>
	            <td align="right"><b>Description:</b></td>
	            <td><%# DataBinder.Eval(Container.DataItem, "Description") %></td>
	          </tr>
	          <tr>
	            <td align="right"><b>Category Name:</b></td>
	            <td><%# DataBinder.Eval(Container.DataItem, "CatName") %></td>
	          </tr>
	          <tr>
	            <td align="right"><b>View Count:</b></td>
	            <td><%# DataBinder.Eval(Container.DataItem, "ViewCount", "{0:#,###}") %></td>
	          </tr>
	        </table>
	      </ItemTemplate>
	    </asp:TemplateColumn>
	  
	  </Columns>	
	</asp:datagrid>

[Return to the article]