webformsintro.aspx

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

ASP.NET 随附了 45 个可以在框外使用的内置服务器控件（有关详细信息，请参阅 <a href="webcontrolsref.aspx">Web 窗体控件引用</a>）。除了使用内置 ASP.NET 控件外，开发人员还可使用由第三方供应商开发的控件。

<p>

下面的示例显示一个简单的日历控件。<b>Calendar</b> 控件在页内由 <b>&lt;acme:calendar runat=server&gt;</b> 标记声明。注意，页顶部的 <b>&lt;% Register %&gt;</b> 指令负责向控件实现的“Acme”代码命名空间注册“Acme”XML 标记前缀。ASP.NET 页分析器然后将在运行时利用该命名空间加载 <b>Calendar</b> 控件类实例。

<p>


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

<p>

本例中的 <b>Calendar</b> 控件被设计为在 Internet Explorer 5.5 上执行“上层样式”处理，在所有其他浏览器上执行“下层”处理。此浏览器探测技术在任何相近的方面都没有 ASP.NET 内置服务器控件提供的复杂。对于 Internet Explorer 5.5 浏览器，它生成 DHTML 输出。在选择日期和定位月份时，此 DHTML 输出不要求与服务器间的往返行程。对于所有其他浏览器，它生成标准的 HTML 3.2。此 HTML 3.2 确实要求与服务器间的往返行程以处理客户端的用户交互。

<p>

<b>重要说明：</b>无论是用“上层”还是“下层”浏览器访问页，页开发人员编写的代码都相同。<b>Calendar</b> 控件本身封装处理这两种情况所需要的所有逻辑。

<!--BEGIN SECTION--> <br> <a name="listsanddata"><br> <span class="subhead">列表、数据和数据绑定</span>
<p>

ASP.NET 提供了一套内置的数据网格和列表控件。这些控件可用于提供由针对数据库或其他数据源的查询驱动的自定义 UI。例如，下面的示例说明可以如何使用 <b>&lt;asp:datagrid runat=server&gt;</b> 控件对用 SQL 数据库查询收集的书籍信息进行数据绑定。

<p>


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

<p>

<b>&lt;asp:datagrid runat=server&gt;</b> <b>DataGrid</b> 控件为快速显示使用传统网格控件 UI 的数据结果提供了容易的方法。或者，ASP.NET 开发人员可以使用 <b>&lt;asp:DataList runat=server&gt;</b> <b>DataList</b> 控件和自定义 <b>ItemTemplate</b> 模板自定义数据信息，如下例所示。

<p>


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

<p>

注意，<b>&lt;asp:datalist runat=server&gt;</b> 控件使最终用户（使用 <b>ItemTemplate</b> 模板属性）能够准确地控制列表中每一项的结构和布局。该控件还自动处理内容的两列环绕（用户可使用数据列表上的 <b>RepeatColumns</b> 属性控制列数）。

<p>

下面的示例提供 <b>&lt;asp:datalist runat=server&gt;</b> 控件的替换视图。 
<p>


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

<p>

注意，本例中的控件、数据模型和页用户与前一个示例中的完全相同。唯一的差别是此处以声明的方式将替换模板提供给代码。

<!--BEGIN SECTION--> <br> <a name="formvalidate"><br> <span class="subhead">窗体验证控件</span>
<p>

ASP.NET Web 窗体页框架提供了一套验证服务器控件。这些控件提供一个易于使用且功能强大的方法来检查输入窗体中的错误，并且在必要时向用户显示消息。

<p>

验证控件像其他服务器控件一样添加到 ASP.NET 页。有不同的控件用于特定的验证类型，如范围检查或模式匹配，以及确保用户不跳过输入字段的 <b>RequiredFieldValidator</b>。

<p>

下面的示例说明如何在一页上使用两个 <b>&lt;asp:requiredfieldvalidator runat=server&gt;</b> 控件验证 <b>TextBox</b> 和 <b>DropDownList</b> 控件的内容。

<p>


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

<p>

注意，验证控件既支持上层客户端，也支持下层客户端。上层浏览器在客户端（使用 JavaScript 和 DHTML）和服务器上执行验证。下层浏览器只在服务器上执行验证。两种情况的编程模型相同。

<p>

注意，ASP.NET 页开发人员可以在运行时随意检查 <b>Page.IsValid</b> 属性，确定页上的<u>所有</u>验证服务器控件当前是否有效。这提供了确定是否继续业务逻辑的简单方法。例如，下面的示例在指定类别上执行数据库查找之前执行 <b>Page.IsValid</b> 检查。

<p>


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


<!--BEGIN SECTION--> <br> <a name="codebehind"><br> <span class="subhead">代码隐藏 Web 窗体</span>
<p>

ASP.NET 支持两种创作动态页的方法。第一种方法已在前面的示例中说明，即在起始 .aspx 文件内物理声明页代码。另一种方法（称为代码隐藏方法）使页代码能够更清晰地从 HTML 内容中分离到完全单独的文件中。 

<p>

下面的示例说明使用代码隐藏方法编写 ASP.NET 页代码。

<p>


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

<p>
<!--BEGIN SECTION--> <a name="endofsection">

<h4><a name="summary">本节小结</a></h4>
<ol>
<li> ASP.NET Web 窗体为生成动态 Web UI 提供了一个容易且功能强大的方法。
<li> ASP.NET Web 窗体页可以以任何浏览器客户端为目标（没有脚本库和 Cookie 要求）。
<li> ASP.NET Web 窗体页提供与现有 ASP 页的兼容性。
<li> ASP.NET 服务器控件提供了封装常用功能的容易方法。
<li> ASP.NET 提供 45 个内置服务器控件。开发人员也可使用第三方生成的控件。
<li> ASP.NET 服务器控件可以自动设计上层和下层 HTML。
<li> ASP.NET 模板提供了自定义列表服务器控件外观的容易方法。
<li> ASP.NET 验证控件提供了进行声明性客户端或服务器数据验证的容易方法。
</ol>
<p>

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