webformsintro.aspx

书籍教程 >> .Net教程 >> asp.net编程精彩百例


<%@ Register TagPrefix="Acme" Namespace="Acme" Assembly="QSTools" %> <%@ Register TagPrefix="Acme" TagName="SourceRef" Src="/quickstart/aspplus/util/SrcRef.ascx"%>

<!-- #include virtual="/quickstart/aspplus/include/header.inc" -->

<h4>Web 窗体介绍</h4>
<p>

<div class="indent" style="font-family:Verdana; font-size:8pt;">
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#webforms">什么是 ASP.NET Web 窗体？</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#writingforms">编写第一个 Web 窗体页</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#usingasp">使用 ASP &lt;% %&gt; 呈现块</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#serverctrls">ASP.NET 服务器控件介绍</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#handlingevts">处理服务器控件事件</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#customctrls">使用自定义服务器控件</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#listsanddata">列表、数据和数据绑定</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#formvalidate">窗体验证控件</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#codebehind">代码隐藏 Web 窗体</a><br>
    <b> <img align="middle" src="/quickstart/images/bullet.gif">&nbsp;&nbsp;</b><a class="toc2" href="#summary">本节小结</a><br>
</div>
<p>
<hr>

<!--BEGIN SECTION--> <a name="webforms"><span class="subhead">什么是 ASP.NET Web 窗体？</span>
<p>

ASP.NET Web 窗体页框架是可以在服务器上用于动态生成 Web 页的可缩放公共语言运行库编程模型。

<p>

作为 ASP 的逻辑演变（ASP.NET 提供与现有页的语法兼容性），ASP.NET Web 窗体框架被特别设计为弥补前一模型中若干主要的不足之处。具体说来，它提供：

<ul>
<li>创建和使用可封装常用功能的可重用 UI 控件，并由此减少页开发人员必须编写的代码量的能力。
<li>开发人员以有序的形式（而不是“面条式代码”）清晰地构造页逻辑的能力。
<li>开发工具为页提供强大的 WYSIWYG 设计支持的能力（现有的 ASP 代码对工具不透明）。
</ul>

<p>

本“入门”节提供一些主要 ASP.NET Web 窗体功能的高级代码演练。后面的“入门”节深入探讨具体的细节。


<!--BEGIN SECTION--> <br> <a name="writingforms"><br> <span class="subhead">编写第一个 Web 窗体页</span>
<p>

ASP.NET Web 窗体页是带 .aspx 文件扩展名的文本文件。可在整个 IIS 虚拟根目录树中部署它们。当浏览器客户端请求 .aspx 资源时，ASP.NET 运行库分析目标文件并将其编译为一个 .NET 框架类。此类然后可用于动态处理传入的请求。（注意只能在第一次访问 .aspx 文件时对其进行编译，已编译的类型实例然后在多个请求间重用）。

<p>

只需采用现有的 HTML 文件并将其扩展名更改为 .aspx（不需要对代码进行任何修改）即可创建 ASP.NET 页。例如，下面的示例说明一个简单的 HTML 页；该页收集用户名和类别首选项，然后在单击按钮时执行将窗体回发到起始页的操作：

<p>

<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
      RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro1.aspx"
      ViewSource="/quickstart/aspplus/samples/webforms/intro/intro1.src"
      Icon="/quickstart/aspplus/images/intro1.gif"
      Caption="C# Intro1.aspx"
      runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
      RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro1.aspx"
      ViewSource="/quickstart/aspplus/samples/webforms/intro/intro1.src"
      Icon="/quickstart/aspplus/images/intro1.gif"
      Caption="VB Intro1.aspx"
      runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
      RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro1.aspx"
      ViewSource="/quickstart/aspplus/samples/webforms/intro/intro1.src"
      Icon="/quickstart/aspplus/images/intro1.gif"
      Caption="JScript Intro1.aspx"
      runat="server" />
  </JsTemplate>
</Acme:LangSwitch>

<p>

<b>重要说明：</b>注意当单击“查找”按钮时，什么也不发生。这是因为 .aspx 文件只包含静态 HTML（不包含动态内容）。因此，在与页的每一行程中发送回客户端的 HTML 都是相同的，这导致窗体字段（文本框和下拉列表）的内容在各请求间丢失。


<!--BEGIN SECTION--> <br> <a name="usingasp"><br> <span class="subhead">使用 ASP &lt;% %&gt; 呈现块</span>
<p>

ASP.NET 提供与现有 ASP 页的语法兼容性。这包括支持可在 .aspx 文件内与 HTML 内容混合的 &lt;% %&gt; 代码呈现块。这些代码块在页呈现时按由上而下的方式执行。

<p>

下面的示例说明可以如何使用 &lt;% %&gt; 呈现块在 HTML 块上循环（每次增加字体大小）：

<p>

<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro2.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro2.src"
  Icon="/quickstart/aspplus/images/intro2.gif"
  Caption="C# Intro2.aspx"
  runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro2.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro2.src"
  Icon="/quickstart/aspplus/images/intro2.gif"
  Caption="VB Intro2.aspx"
  runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro2.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro2.src"
  Icon="/quickstart/aspplus/images/intro2.gif"
  Caption="JScript Intro2.aspx"
  runat="server" />
  </JsTemplate>
</Acme:LangSwitch>


<p>

<b>重要说明：</b>与 ASP 不同，上述 &lt;% %&gt; 块中使用的代码是实际编译过的，而不是用脚本引擎解释的。这使运行库的执行性能得到了提高。

<p>

ASP.NET 页开发人员可以基本上像他们今天对待 ASP 那样，利用 &lt;% %&gt; 代码块动态修改 HTML 输出。例如，下面的示例说明可以如何使用 &lt;% %&gt; 代码块解释从客户端回发的结果。

<p>

<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro3.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro3.src"
  Icon="/quickstart/aspplus/images/intro3.gif"
  Caption="C# Intro3.aspx"
  runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro3.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro3.src"
  Icon="/quickstart/aspplus/images/intro3.gif"
  Caption="VB Intro3.aspx"
  runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro3.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro3.src"
  Icon="/quickstart/aspplus/images/intro3.gif"
  Caption="JScript Intro3.aspx"
  runat="server" />
  </JsTemplate>
</Acme:LangSwitch>

<p>

<b>重要说明：</b>虽然 &lt;% %&gt; 代码块为自定义操作从 ASP.NET 页返回的文本输出提供了功能强大的方法，但它们不提供清晰的 HTML 编程模型。如上例所述，只使用 &lt;% %&gt; 代码块的开发人员必须自定义管理往返行程间的页状态和自定义解释传递的值。

<!--BEGIN SECTION--> <br> <a name="serverctrls"><br> <span class="subhead">ASP.NET 服务器控件介绍</span>
<p>

除了（或者不）使用 &lt;% %&gt; 代码块编写动态内容代码外，ASP.NET 页开发人员还可使用 ASP.NET 服务器控件编写 Web 页代码。服务器控件在 .aspx 文件内由自定义标记或包含 <b>runat=&quot;server&quot;</b> 属性值的内部 HTML 标记声明。内部 HTML 标记由 <b>System.Web.UI.HtmlControls</b> 命名空间内的某个控件处理。给不显式映射到某个控件的标记分配的类型是 <b>System.Web.UI.HtmlControls.HtmlGenericControl</b>。

<p>

下面的示例使用四个服务器控件：<b>&lt;form runat=server&gt;</b>、<b>&lt;asp:textbox runat=server&gt;</b>、<b>&lt;asp:dropdownlist runat=server&gt;</b> 和 <b>&lt;asp:button runat=server&gt;</b>。在运行时这些服务器控件自动生成 HTML 内容。

<p>


<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro4.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro4.src"
  Icon="/quickstart/aspplus/images/intro4.gif"
  Caption="C# Intro4.aspx"
  runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro4.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro4.src"
  Icon="/quickstart/aspplus/images/intro4.gif"
  Caption="VB Intro4.aspx"
  runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro4.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro4.src"
  Icon="/quickstart/aspplus/images/intro4.gif"
  Caption="JScript Intro4.aspx"
  runat="server" />
  </JsTemplate>
</Acme:LangSwitch>

<p>

<b>重要说明：</b>注意这些服务器控件在与服务器的往返行程之间自动维护客户端输入的任何值。此控件状态不存储在服务器上（而是存储在请求间往返的 <b>&lt;input type=&quot;hidden&quot;&gt;</b> 窗体字段内）。还要注意不需要客户端脚本。

<p>

除了支持标准的 HTML 输入控件外，ASP.NET 还使开发人员能够在页上利用更丰富的自定义控件。例如，下面的示例说明可以如何使用 <b>&lt;asp:adrotator&gt;</b> 控件在页上动态显示旋转的广告。

<p>

<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro5.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro5.src"
  Icon="/quickstart/aspplus/images/intro5.gif"
  Caption="C# Intro5.aspx"
  runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro5.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro5.src"
  Icon="/quickstart/aspplus/images/intro5.gif"
  Caption="VB Intro5.aspx"
  runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro5.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro5.src"
  Icon="/quickstart/aspplus/images/intro5.gif"
  Caption="JScript Intro5.aspx"
  runat="server" />
  </JsTemplate>
</Acme:LangSwitch>

<p>

<b>重要说明：</b>在此“入门”的 <a href="webcontrolsref.aspx">Web 窗体控件引用</a>一节中可以找到所有内置服务器控件的详细列表。

<!--BEGIN SECTION--> <br> <a name="handlingevts"><br> <span class="subhead">处理服务器控件事件</span>

<p>

每个 ASP.NET 服务器控件都能公开包含属性、方法和事件的对象模型。ASP.NET 开发人员可以使用该对象模型清晰地修改页并与页交互。

<p>

下面的示例说明 ASP.NET 页开发人员可以如何处理来自 <b>&lt;asp:button runat=server&gt;</b> 控件的 <b>OnClick</b> 事件以操作 <b>&lt;asp:label runat=server&gt;</b> 控件的 <b>Text</b> 属性。

<p>


<Acme:LangSwitch runat="server">
  <CsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/CS/intro6.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro6.src"
  Icon="/quickstart/aspplus/images/intro6.gif"
  Caption="C# Intro6.aspx"
  runat="server" />
  </CsTemplate>
  <VbTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/VB/intro6.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro6.src"
  Icon="/quickstart/aspplus/images/intro6.gif"
  Caption="VB Intro6.aspx"
  runat="server" />
  </VbTemplate>
  <JsTemplate>
<Acme:SourceRef
  RunSample="/quickstart/aspplus/samples/webforms/intro/JS/intro6.aspx"
  ViewSource="/quickstart/aspplus/samples/webforms/intro/intro6.src"
  Icon="/quickstart/aspplus/images/intro6.gif"
  Caption="JScript Intro6.aspx"
  runat="server" />
  </JsTemplate>
</Acme:LangSwitch>

<p>

这个简单的示例在功能上等效于本节前面说明的“Intro3”示例。然而，注意在这个基于服务器控件的新版本中代码要清晰容易得多。


<!--BEGIN SECTION--> <br> <a name="customctrls"><br> <span class="subhead">使用自定义服务器控件</span>
<p>