Getting Started with ASP.NET - ' Generating HTML' (
Page 2 of 4 )
A first example: Generating HTML
The simplest way to use ASP.NET is to put code right in the HTML. With ASP.NET, you give your pages an extension of .aspx instead of .html. This way the server knows to process them as ASP.NET pages; the server will then run the VB.NET or C# code before sending the page down to the client browser. (The page that the browser receives won't have the VB.NET or C# code in it; it'll be removed.)
By default, your project gets created with a single page, Default.aspx. We'll use this page for the first example. If the page isn't showing in the code editor, double-click its name in the Solution Explorer.
At the top of the code is a line providing information to the ASP.NET server about the page, including the language of choice (C# or VB.NET) and the name of an external file where you can put additional source code that accompanies this file. This line will not be present in the resulting HTML file.
Next is a standard DOCTYPE line; this is used by the browser and isn't unique to ASP.NET, and so I won't go into details here.
After that are several lines of HTML. These lines will be present in the final HTML, but with some slight modifications from the ASP.NET server.
In between the <div> and </div> lines, add the following code shown in blue bold:
<div>
<%
Response.Write("My Web Page<br>");
Response.Write("Part 1");
%>
</div>
Don't forget the <% and %> lines. These tell the server that the lines in between are C# code and are to be run by the server. In other words, this is server-side code.
The ASP.NET server will run the code and replace it with the output from Response.Write. The first line writes My Web Page<br>, and this string will end up in the resulting HTML file right where the code is.
Save the file.
Run the web site by clicking Debug⇒Start Without Debugging.
You'll see a balloon appear over the system tray indicating the web server is starting. Then you'll see your browser open and the page appear in it, as shown in the figure to the right.
Take a look at the browser's source code. It looks like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
Untitled Page
</title></head>
<body>
<form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
value="/wEPDwUJOTU4MjMyMzI1ZGSKdaPMzrXPtsThkK/0rjXwY7Zaqw==" />
</div>
<div>
My Web Page<br>Part 1
</div>
</form>
</body>
Notice the similarity to the original .aspx file, but also notice the differences. For example, the server added a hidden input field that keeps track of encrypted session information. (And thankfully, you don't have to do anything with this hidden field; the server takes care of it all for you.) But more importantly, look at the lines towards the end. Your server-side C# code was replaced with their output.