ASP.NET WEB form
- 本文导航
-
<<返回分页阅读
1
在ASP.NET中一个网页或窗口被看成一个WEB Form,Web Form 被看成是一个对象而被赋予了属性、方法,事件。.NET架构里面一个比较重要的概念就是"对象":所有的控件都是对象,甚至数据类型都成了对象;每种数据类型都有自己特有的属性和方法。
WEB FORM的后缀名是ASPX。当一个浏览器第一次请求一个ASPX文件时,WEB FORM页面将被CLR(common language runtime)编译器编译。此后,当再有用户访问此页面的时候,由于ASPX页面已经被编译过,所以,CLR会直接执行编译过的代码。
为了简化程序员的工作,ASPX页面不需要手工编译,而是在页面被调用的时候,由CLR自行决定是否编译。一般来说,下面两种情况下,ASPX会被重新编译:
1.ASPX页面第一次被浏览器请求;
2.ASPX被改写
由于ASPX页面可以被编译,所以ASPX页面具有组件一样的性能。这就使得ASPX页面至少比同样功能的ASP页面快250%!
WEB页面处理过程
和所有的服务器端进程一样,当ASPX页面被客户端请求时,页面的服务器端代码被执行,执行结果被送回到浏览器端。这一点和ASP并没有太大的不同。
但是,asp.net的架构为我们做了许多别的事情。比如,它会自动处理浏览器的表单提交,把各个表单域的输入值变成对象的属性,使得我们可以像访问对象属性那样来访问客户的输入。它还把客户的点击映射到不同的服务器端事件。
WEB Form的处理过程如下:
用户对Server Control的一次操作,就可能引起页面的一次往返处理:页面被提交到服务器端,执行响应的事件处理代码,重建页面,然后返回到客户端。
每一次页面被请求,或者页面事件被提交到服务器,asp.net运行环境将执行必要的代码,重建整个页面,把结果页面送到浏览器,然后抛弃页面的变量、控件的状态和属性等等页面信息。当下一次页面被处理时,asp.net运行环境是不知道它的上一次执行情况的。
在asp.net中,页面对象的属性、页面控件的属性被称为"view state"(页面状态)。页面状态在asp.net中被受到特别关照。请看服务器端(page1.aspx)的代码:
<!--源文件:form\web页面简介\page1.aspx-->
<HTML>
<BODY>
<SCRIPT language="VB" runat="server">
Sub ShowValues(Sender As Object, Args As EventArgs)
divResult.innerText = "You selected '" _
& selOpSys.value & "' for machine '" _
& txtName.value & "'."
End Sub
</SCRIPT>
<DIV runat="server">
</DIV>
<FORM runat="server">
机器名:
<INPUT type="text" runat="server">
<P />
操作系统:
<select size="1" runat="server">
<OPTION>Windows 95</OPTION>
<OPTION>Windows 98</OPTION>
<OPTION>Windows NT4</OPTION>
<OPTION>Windows 2000</OPTION>
</SELECT>
<P />
<INPUT type="submit" value="Submit" runat="server" onserverclick="ShowValues">
</FORM>
</BODY>
</HTML>
运行后将自动被解释成客户端代码,如下:
<HTML>
<BODY>
You selected 'Windows 98' for machine 'iceberg'.
<FORM method="post" action="pageone.aspx">
<INPUT type="hidden" value="a0z1741688109__x">
机器名:
<INPUT type="text" value="tizzy">
<P />
操作系统:
<SELECT size="1">
<OPTION value="Windows 95">Windows 95</OPTION>
<OPTION selected value="Windows 98">Windows 98</OPTION>
<OPTION value="Windows NT4">Windows NT4</OPTION>
<OPTION value="Windows 2000">Windows 2000</OPTION>
</SELECT>
<P />
<INPUT type="submit" value="Submit">
</FORM>
</BODY>
</HTML>
对于上面的代码,服务器端控件能在服务器端脚本中被自由运用。如果我们用传统的ASP代码实现上述的功能的话:
If Len(Request.Form("selOpSys")) > 0 Then
StrOpSys = Request.Form("selOpSys")
StrName = Request.Form("txtName")
Response.Write("You selected '" & strOpSys _
& "' for machine '" & strName & "'.")
End If
如果我们用asp.net的话,程序代码如下:
If Len(selOpSys.value) > 0 Then
Response.Write("You selected '" & selOpSys.value _
& "' for machine '" & txtName.value & "'.")
End If
通过上面例子不难看出:asp.net页面具有组件方式的方便性和灵活性。
2
Web Form事件模型
在asp.net中,事件是一个非常重要的概念。我们举两个例子来说明在Web Form 中的应用。
例子一:多按钮事件
我们在一个<form></form>里面有几个按钮,多个事件的响应我们该怎么处理呢?在asp.net中有很好的处理机制,我们可以在一个页面中写几个方法来分别响应不同的事件。
设计思想:根据五个按钮的功能,我们定义了五个方法:AddBtn_Click(Sender As Object, E As EventArgs)、AddAllBtn_Click(Sender As Object, E As EventArgs)、RemoveBtn_Click(Sender As Object, E As EventArgs)、RemoveAllBtn_Click(Sender As Object, E As EventArgs)、result(Sender As Object,E As EventArgs),分别用来处理全部加进、单个加进、单个取消、全部取消和提交事件。我们的form提交的时候,还是提交给本页面,由本页面进行处理。(由于篇幅有限,这里就不登载代码了,有兴趣的朋友可以看《ASP.NET完全入门》第二篇第一章第四节 Web事件模型)
例子二:AutoPostBack
PostBack属性在Page_Load事件中出现的,在一个用户请求结束后,如果页面重新Load,则返回一个true。这对初始化一个页面来讲是一件非常容易的事情, 代码见《ASP.NET完全入门》第二篇第一章第四节 Web事件模型。
服务器端控件
服务器端控件,英文是Server Control。这是WEB页面能够容纳的对象之一。
为什么叫"Server Control"?这是因为这些Control是在服务器端存在的。服务器端控件也有自己的外观,在客户端浏览器中,Server Control的外观由HTML代码来表现。Server Control会在初始化时,根据客户的浏览器版本,自动生成适合浏览器的HTML代码。
在这一部分作者介绍了各种服务器控件,这里我只摘录其中的 ValidationSummary控件节选
用户的输入有时候是按照一定的顺序来的,有效性控件验证用户的输入并设置一个属性来线使用户的输入是否通过了验证。当所用得验证项都被处理之后,页面的IsValid属性就被设置,当有其中的一个验证没有通过时,整个页面将会不被通过验证。
当页面的IsValid属性为false时,ValidationSummary属性将会表现出来。他获得页面上的每个确认控件并对每个错误提出修改信息。
文件Summary.aspx的内容:
<!--源文件:form\ServerControl\summary.aspx-->
<%@ Page clienttarget=downlevel %>
<html>
<head>
<script language="VB" runat="server">
Sub ListFormat_SelectedIndexChanged(sender As Object, e As EventArgs)
' Change display mode of the validator summary when a new option
' is selected from the "ListFormat" dropdownlist
valSum.DisplayMode = ListFormat.SelectedIndex
End Sub
</script>
</head>
<BODY>
<h3><font face="Verdana">ValidationSummary Sample</font></h3>
<p>
<form runat="server">
<table cellpadding=10>
<tr>
<td>
<table bgcolor="#eeeeee" cellpadding=10>
<tr>
<td colspan=3>
<font face=Verdana size=2><b>Credit Card Information</b></font>
</td>
</tr>
<tr>
<td align=right>
<font face=Verdana size=2>Card Type:</font>
</td>
<td>
<ASP:RadioButtonList id=RadioButtonList1 RepeatLayout="Flow"
runat=server>
<asp:ListItem>MasterCard</asp:ListItem>
<asp:ListItem>Visa</asp:ListItem>
</ASP:RadioButtonList>
</td>
<td align=middle rowspan=1>
<asp:RequiredFieldValidator
ControlToValidate="RadioButtonList1"
ErrorMessage="Card Type. "
Display="Static"
InitialValue="" runat=server>
*
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td align=right>
<font face=Verdana size=2>Card Number:</font>
</td>
<td>
<ASP:TextBox id=TextBox1 runat=server />
</td>
<td>
<asp:RequiredFieldValidator
ControlToValidate="TextBox1"
ErrorMessage="Card Number. "
Display="Static"
Width="100%" runat=server>
*
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td align=right>
<font face=Verdana size=2>Expiration Date:</font>
</td>
<td>
<ASP:DropDownList id=DropDownList1 runat=server>
<asp:ListItem></asp:ListItem>
<asp:ListItem >06/00</asp:ListItem>
<asp:ListItem >07/00</asp:ListItem>
<asp:ListItem >08/00</asp:ListItem>
<asp:ListItem >09/00</asp:ListItem>
<asp:ListItem >10/00</asp:ListItem>
<asp:ListItem >11/00</asp:ListItem>
<asp:ListItem >01/01</asp:ListItem>
<asp:ListItem >02/01</asp:ListItem>
<asp:ListItem >03/01</asp:ListItem>
<asp:ListItem >04/01</asp:ListItem>
<asp:ListItem >05/01</asp:ListItem>
<asp:ListItem >06/01</asp:ListItem>
<asp:ListItem >07/01</asp:ListItem>
<asp:ListItem >08/01</asp:ListItem>
<asp:ListItem >09/01</asp:ListItem>
<asp:ListItem >10/01</asp:ListItem>
<asp:ListItem >11/01</asp:ListItem>
<asp:ListItem >12/01</asp:ListItem>
</ASP:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator
ControlToValidate="DropDownList1"
ErrorMessage="Expiration Date. "
Display="Static"
InitialValue=""
Width="100%"
runat=server>
*
</asp:RequiredFieldValidator>
</td>
<td>
</tr>
<tr>
<td></td>
<td>
<ASP:Button id=Button1 text="有效性验证" runat=server />
</td>
<td></td>
</tr>
</table>
</td>
<td valign=top>
<table cellpadding=20><tr><td>
<asp:ValidationSummary runat="server"
HeaderText="You must enter a value in the following fields:"
Font-Name="verdana"
Font-Size="12"
/>
</td></tr></table>
</td>
</tr>
</table>
<font face="verdana" size="-1">Select the type of validation summary display you wish: </font>
<asp:DropDownList AutoPostBack=true
OnSelectedIndexChanged="ListFormat_SelectedIndexChanged" runat=server >
<asp:ListItem>List</asp:ListItem>
<asp:ListItem selected>Bulleted List</asp:ListItem>
<asp:ListItem>Single Paragraph</asp:ListItem>
</asp:DropDownList>
</form>
</body>
</html>
3
服务器端的HTML控件
HTML控件在服务器端是可见的,所以我们可以根据它来按照我们的意愿来编写。HTML控件表现为一些可见的控件。
作者在这一章中全面介绍了各类HTTP 控件,我也只摘录其中的一节:
HtmlTable控件
HtmlTable服务控件能让你轻松的创建你的表格的行和列,也可以按照程序的模式自动生成表格。
我们的例子展示了这个特性:
<table CellPadding=4 CellSpacing=0 runat="server" />
这就是在asp.net中,表格的表示。做两个Select控件来让用户选择表格的属性:
<p>
行:
<select runat="server">
<option Value="1">1</option>
<option Value="2">2</option>
<option Value="3">3</option>
<option Value="4">4</option>
</select>
<br>
列:
<select runat="server">
<option Value="1">1</option>
<option Value="2">2</option>
<option Value="3">3</option>
<option Value="4">4</option>
</select>
在用户提交的时候,实际上我们示对页面进行了刷新,即在Page_Load方法里面处理,具体如下(htmltable.aspx):
<!--源文件: form\HtmlControl\htmltable.aspx-->
<html>
<head>
<script language="VB" runat="server">
Sub Page_Load(sender As Object, e As EventArgs)
Dim numrows As Integer
Dim numcells As Integer
Dim i As Integer = 0
Dim j As Integer = 0
Dim Row As Integer = 0
Dim r As HtmlTableRow
Dim c As HtmlTableCell
' 产生表格
numrows = CInt(Select1.Value)
numcells = CInt(Select2.Value)
For j = 0 To numrows-1
r = new HtmlTableRow()
If (row Mod 2 <> 0) Then
r.BgColor = "Gainsboro"
End If
row += 1
For i = 0 To numcells-1
c = new HtmlTableCell()
c.Controls.Add(new LiteralControl("row " & j & ", cell " & i))
r.Cells.Add(c)
Next i
Table1.Rows.Add(r)
Next j
End Sub
</script>
</head>
<body>
<h3><font face="Verdana">.NET->HtmlTable</font></h3>
<form runat=server>
<font face="Verdana" size="-1">
<p>
<table CellPadding=4 CellSpacing=0 runat="server" />
<p>
行:
<select runat="server">
<option Value="1">1</option>
<option Value="2">2</option>
<option Value="3">3</option>
<option Value="4">4</option>
</select>
<br>
列:
<select runat="server">
<option Value="1">1</option>
<option Value="2">2</option>
<option Value="3">3</option>
<option Value="4">4</option>
</select>
<input type="submit" value="产生表格" runat="server">
</font>
</form>
</body>
</html>
(作者:天极新技术工作室责任编辑:方舟)
欢迎在新浪微博上关注我们