Retrieving the Rendered HTML of an ASP.NET Web Control

This demo illustrates how to programmatically retrieve the HTML that is rendered by any given Web control on an ASP.NET Web page. Below you will see the DataGrid that is rendered automatically, and then an outputting of the HTML that makes up the DataGrid; this HTML was retrieved programmatically.


FAQ IDQuestionTotal Views
181How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency.869,752
161How can I convert a Recordset into an array? Also, how can I convert an array into a Recordset?214,011
115I 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?213,675
83How can I quickly sort a VBScript array? 206,829
106How can I find out if a record already exists in a database? If it doesn't, I want to add it.163,703
190How do I display data on a web page using arrays instead of Do...While...MoveNext...???...162,749
118When 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... 147,414
30For session variables to work, must the Web visitor have cookies enabled?114,715
14Can I send emails without using CDONTS?111,775
153How 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?110,406

Below you will see the rendered HTML for the DataGrid Web control

<table cellspacing="0" align="Center" rules="all" border="1" id="dgPopularFAQs" style="font-family:Verdana;width:85%;border-collapse:collapse;">
	<tr align="center" style="color:White;background-color:Navy;font-size:13pt;font-weight:bold;">
		<td>FAQ ID</td><td>Question</td><td>Total Views</td>
	</tr><tr style="font-size:9pt;">
		<td align="center">181</td><td>How can I format numbers and date/times using ASP.NET?  For example, I want to format a number as a currency.</td><td align="right">869,752</td>
	</tr><tr style="background-color:#DDDDDD;font-size:9pt;">
		<td align="center">161</td><td>How can I convert a Recordset into an array?  Also, how can I convert an array into a Recordset?</td><td align="right">214,011</td>
	</tr><tr style="font-size:9pt;">
		<td align="center">115</td><td>I am using Access and getting a 80004005 error (or a <code>[Microsoft][ODBC Microsoft Access Driver] The Microsoft Jet database engine cannot open the file '(unknown)'</code> error) when trying to open a connection!  How can I fix this problem?</td><td align="right">213,675</td>
	</tr><tr style="background-color:#DDDDDD;font-size:9pt;">
		<td align="center">83</td><td>How can I quickly sort a VBScript array? </td><td align="right">206,829</td>
	</tr><tr style="font-size:9pt;">
		<td align="center">106</td><td>How can I find out if a record already exists in a database? If it doesn't, I want to add it.</td><td align="right">163,703</td>
	</tr><tr style="background-color:#DDDDDD;font-size:9pt;">
		<td align="center">190</td><td>How do I display data on a web page using arrays instead of Do...While...MoveNext...???...</td><td align="right">162,749</td>
	</tr><tr style="font-size:9pt;">
		<td align="center">118</td><td>When I get a list of all files in a directory via the <code>FileSystemObject</code>, they aren't ordered in any reasonable way.  <b>How can I sort the files by name?</b> Or by size?  Or by date created?  Or...
</td><td align="right">147,414</td>
	</tr><tr style="background-color:#DDDDDD;font-size:9pt;">
		<td align="center">30</td><td>For session variables to work, must the Web visitor have cookies enabled?</td><td align="right">114,715</td>
	</tr><tr style="font-size:9pt;">
		<td align="center">14</td><td>Can I send emails <i>without</i> using CDONTS?</td><td align="right">111,775</td>
	</tr><tr style="background-color:#DDDDDD;font-size:9pt;">
		<td align="center">153</td><td>How can I take the result of a <B>SELECT...MULTIPLE</B> 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?</td><td align="right">110,406</td>
	</tr>
</table>
  


Source Code

<% @Import Namespace="System.IO" %>
<% @Import Namespace="System.Data" %>
<% @Import Namespace="System.Data.SqlClient" %>
<script language="vb" runat="server">
  Sub Page_Load(sender as Object, e as EventArgs)
    '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()	


    'Get the rendered HTML
    Dim SB as New StringBuilder()    
    Dim SW as New StringWriter(SB)
    Dim htmlTW as New HtmlTextWriter(SW)
    dgPopularFAQs.RenderControl(htmlTW)
    
    Dim dataGridHTML as String = SB.ToString()
    
    ltlHTMLOutput.Text = Server.HtmlEncode(dataGridHTML)
  End Sub
</script>

  <asp:datagrid id="dgPopularFAQs" runat="server"
        AutoGenerateColumns="False"
        Font-Name="Verdana"  Width="85%"
        HorizontalAlign="Center"
        ItemStyle-Font-Size="9pt"
        AlternatingItemStyle-BackColor="#dddddd">
     
     <HeaderStyle BackColor="Navy" ForeColor="White" Font-Bold="True"
          Font-Size="13pt" HorizontalAlign="Center" /> 
       
     <Columns>
       <asp:BoundColumn HeaderText="FAQ ID" DataField="FAQID"
               ItemStyle-HorizontalAlign="Center" />
       <asp:BoundColumn HeaderText="Question" DataField="Description" />
       <asp:BoundColumn HeaderText="Total Views" DataField="ViewCount"
              DataFormatString="{0:#,###}" ItemStyle-HorizontalAlign="right" />
     </Columns>
  </asp:DataGrid>
  <p>Below you will see the rendered HTML for the DataGrid Web control</p>
  <pre>
    <asp:literal id="ltlHTMLOutput" runat="server" />
  </pre>


[Return to the article]