用ASP.NET建立简单的Web Form 

ASP.NET引入了一种新的Web编程方法。对于使用传统编程语言如Visual Basic或C++的人，这种方法是很熟悉的。如果你是一个Web程序员只接触过脚本语言的话，不必着急，这篇文章将使你快速入门。
作为程序员，我们再也不必将HTML和代码混在一起，再也不必从上往下一行一行的写代码了。ASP.NET让代码和表现分开，使用了事件驱动的编程模式。在这里，我们将看到ASP.NET中Web Form的基本结构。
ASP.NET的页面是事件驱动和面向对象的。就是说，程序员能为事件提供代码，如按钮的点击，页面的调用等等。在页面中能被编程访问的每个标记都有一个runat=server的属性。尽管标准的HTML控件仍能被使用，但ASP.NET提供了更加强大的服务端控件。这些控件提供了一套自己的方法和属性，通过它们能充分的定制控件的输出。这些控件和页面一起被编译，它们依据客户端浏览器的版本输出不同的HTML。这就使得我们不需要考虑浏览器兼容的问题，一个页面可以在任何的浏览器上运行。
我们建立一张页面，两个输入框，收集访问者的名字和最喜欢的颜色。另外，我们希望结果传回本身，然后在最上方显示一行信息，并维持输入框中的内容。

这是传统的ASP页面

1@ Language=VBScript 

1<html>
2<head>
3<title>2000081402</title>
4</head>
5<body>
6<form action="sample1.asp" id="sample1" method="post">

If Request.Form.Count &lt;&gt; 0 Then
Response.Write "Your name is "
Response.Write Request.Form("txtName")
Response.Write ", and your favoritecolor is "
Response.Write Request.Form("selColor")
Response.Write "<br/>"
End If

 1<table border="0" cellpadding="4" cellspacing="0">
 2<tr>
 3<td><p align="right">What is yourname:</p></td>
 4<td><input =request.form("txtname")="" ```"="" name='txtNamevalue="```' type="text"/></td></tr>
 5<tr>
 6<td><p align="right">What is yourfavorite color:</p></td>
 7<td>
 8<select name="selColor">
 9<option "selected"="" ```="" if="" request.form("selcolor")="Black" response.write="" then="">Black</option>
10<option "selected"="" ```="" if="" request.form("selcolor")="Blue" response.write="" then="">Blue</option>
11<option "selected"="" ```="" if="" request.form("selcolor")="Green" response.write="" then="">Green</option>
12<option "selected"="" ```="" if="" request.form("selcolor")="Pink" response.write="" then="">Pink</option>
13<option "selected"="" ```="" if="" request.form("selcolor")="Red" response.write="" then=""&gt;Red&lt;/option&gt;
14&lt;/select&gt;
15&lt;/td&gt;&lt;/tr&gt;
16&lt;tr&gt;
17&lt;td&gt; &lt;/td&gt;
18&lt;td&gt;&lt;input id="submit" type="submit" value="Submit"/&gt;&lt;/td&gt;&lt;/tr&gt;
19&lt;/table&gt;
20&lt;/form&gt;
21&lt;/body&gt;
22&lt;/html&gt;

我们看到，在这里我们不得不将ASP代码和HTML混在一起，使得代码非常的难以看懂，想象一下如果一个非常复杂的页面……
我们的页面首先判断是否是回传，还是第一次访问。我们通过检查Request.Form集合。如果是0，表示是第一次访问，否则表示提交的按钮被按下了，我们将通过Response.Write输出一条信息给用户。

1   
2If Request.Form.Count &lt;&gt; 0 Then   
3Response.Write "Your name is "   
4Response.Write Request.Form("txtName")   
5Response.Write ", and your favoritecolor is "   
6Response.Write Request.Form("selColor")   
7Response.Write "

``` " End If
1  
2对于我们表单中的每个元素，我们必须通过代码来使它们保持状态。这些代码简单而相似。

<td><input =request.form("txtname")="" "="" name='txtNamevalue="' type="text"/></td>

1...

<select name="selColor"> <option "selected"="" ```="" if="" request.form("selcolor")="Black" response.write="" then="">Black

``` ASP.NET的一个好处就是简单。常见普通的一些功能不再需要写许多代码。简单的声明一个服务端控件就可以提供很多功能。

这是ASP.NET中的页面

1@ Page Language="vb" 

 1<html>
 2<head>
 3<title>2000081402</title>
 4<script language="vb" runat="server">   
 5Sub Page_Load(Source As Object,E AsEventArgs)   
 6If Page.IsPostBack Then   
 7divResults.innerText = "Your name is" & txtName.Value & _   
 8", and your favorite color is "& selColor.Value   
 9End If   
10End Sub   
11</script>
12</head>
13<body>
14<form id="sample1" method="post" runat="server">
15<div id="divResults" runat="server"></div>
16<table border="0" cellpadding="4" cellspacing="0">
17<tr>
18<td>
19<p align="right">What is your name:</p></td>
20<td><input id="txtName" runat="server" type="text"/></td></tr>
21<tr>
22<td>
23<p align="right">What is your favoritecolor:</p></td>
24<td>
25<select id="selColor" runat="server">
26<option>Black</option>
27<option>Blue</option>
28<option>Green</option>
29<option>Pink</option>
30<option>Red</option>
31</select>
32</td></tr>
33<tr>
34<td> </td><td>
35<input id='submitvalue="Submit"' runat="server/" type="submit"/>
36</td></tr>
37</table>
38</form>
39</body>
40</html>

"runat=server"属性
给普通的HTML元素加上"runat=server"的属性，它就成了ASP.NET的服务端控件。我们可以通过ID编程访问这些服务端控件。我们不再使用Response.Write来输出信息（虽然我们还是可以使用的），我们通过一个服务端的DIV标记来输出信息给用户。

1<div id="divResults" runat="server"></div>

我们可以编程改变服务端控件的属性如"innerText"。

Page_Load事件和IsPostBack Method方法
首先，我们要检查是不是第一次访问。由于这是一个常规的检查，ASP.NET提供了一个页面的方法：IsPostBack。这个方法当页面是提交时返回真，第一次访问的话返回false。我们可以在任何的服务器端代码中进行检查。我们是在Page_Load事件中检查的。
就像我上面说的，每一个服务端控件都是一个对象，包括Page。作为一个对象，我们能访问对象的属性，方法和事件如Page_Load。当页面被调用时，这个事件就被触发了，事件的代码就被执行了。如果Page.IsPostBack返回真，这是用Div控件的innerText属性输出信息。例外，由于Form中的元素都是服务端控件，我们可以直接来访问他们的属性而不用使用Request.Form。我们可以通过控件的ID来访问Value这个属性来得到值。

1<script language="vb" runat="server">   
2Sub Page_Load(Source As Object,E AsEventArgs)   
3If Page.IsPostBack Then   
4divResults.innerText = "Your name is" & txtName.Value & _   
5", and your favorite color is "& selColor.Value   
6End If   
7End Sub   
8</script>

管理状态
由于我们所有的元素都是服务端控件了，所以它们的状态都是自动管理的。这种状态管理使用过页面中的一个隐藏字段来完成的。
下面是在浏览其中网页的源程序。

 1<html>
 2<head>
 3<title>2000081402</title>
 4</head>
 5<body>
 6<form action="sample1.aspx" id="sample1" method="post" name="sample1">
 7<input name="__VIEWSTATE" type="hidden" value="a0z1019323966_a0z_hz5z2x_a0z_hz5z1x_a0zhzinnerhtml_Yourname is Doug Seven, and your favorite coloris Greenx_xxxxx_x"/>
 8<div id="strResults">Yourname is Doug Seven, and your favorite coloris Green</div>
 9<table border="0" cellpadding="4" cellspacing="0">
10<tr>
11<td>
12<p align="right">What is your name:</p></td>
13<td><input id="txtName" name="txtName" type="text" value="Doug Seven"/></td></tr>
14<tr>
15<td>
16<p align="right">What is your favoritecolor:</p></td>
17<td>
18<select id="selColor" name="selColor">
19<option value="Black">Black</option>
20<option value="Blue">Blue</option>
21<option selected="" value="Green">Green</option>
22<option value="Pink">Pink</option>
23<option value="Red">Red</option>
24</select>
25</td></tr>
26<tr>
27<td></td>
28<td><input id="submit" name="submit" type="submit" value="Submit"/></td></tr>
29</table>
30</form>
31</body>
32</html>

我们通过这种方法来管理状态，不必考虑服务器的内存使用，而且由于状态是在一个隐藏的字段中，它能在Web Farm或Web Garden中很好的运行。
在这篇文章里，我们一起看了ASP.NET的Web Form的基本结构。我们从程序中就能看到通过使用服务端控件能减少许多代码量，能更容易的控制输出。

Published At
Categories with Web编程
Tagged with
comments powered by Disqus