Hello Atlas

• 下载源代码 - 15.5 Kb

Atlas 的第一次“二次接触”（现称为“Microsoft ASP.NET AJAX”）

我一直喜欢用“动手实践”的方式来体验新技术和软件。下载它，用它来编码，试用一下，看看效果如何。遇到困难时查阅手册，然后继续前进！这通常是周六下午的最佳利用方式，那时你累得不想看太多教科书或手册，又过于兴奋而不想整天看电视。

当我第一次接触 Atlas 的早期 CTP 版本时，我采用了同样的方法，并意识到，如果没有四小时的阅读时间，我肯定会一败涂地。显然，Atlas 不像其他微软产品那样“对开发者友好”，这也是可以理解的。它是一个非常早期的社区预览版，不指望它在任何方面都完美无缺！

本周我读了一些博文，它们似乎表明 Atlas 正在快速成熟，现在是可以实际做一些事情的时候了，而无需花费数小时阅读手册。我决定采用同样的“动手实践”方法，看看我的上次接触 Atlas 以来，事情发生了多大的变化。

这次，我的重点是 下载 Atlas 并用一个简单的“Hello World”程序进行试用。这篇文章更像是一篇关于我的经历的博文，也是试图在假期将我学到的东西分享给大家。

注意：本文档基于 Atlas 的 2006 年 4 月 CTP 版本编写，并已更新以兼容 **“Microsoft ASP.NET AJAX 1.0 Beta 2”**。如果需要，当“Microsoft ASP.NET AJAX 1.0 正式发布”时，还会进行更多更改，但为了保持一致性，在本文中，我将继续将“Microsoft ASP.NET AJAX 1.0”称为“Atlas”。

开始吧！

下载并安装 Atlas 易如反掌！下载并安装 Atlas 后，安装程序会将 Visual Studio .NET 2005 模板添加到你的 Visual Studio 中，这样你就可以轻松创建 Atlas 网站了。我个人认为，这比早期 CTP 版本有了很大的进步，当时的下载需要开发者阅读并遵循冗长的说明。

快速的“下一步、下一步、下一步、完成”安装完成后，我们就可以创建“新的 Atlas 网站”了，这非常简单！启动 Visual Studio .NET 2005。点击 **“文件 / 新建 / 网站…”**，然后选择 **“[ASP.NET AJAX 启用的网站]”** 模板。

该模板创建一个空白网站，包含一个 Web.Config 文件和一个 Default.aspx 文件，我们将使用它们来编写即将编写的“Hello World”示例。

编写这个“Hello World”程序的目的是很简单。它旨在让我们专注于 Atlas 能快速做些什么，而不深入数据库代码或编写大量 DataView 代码。在本文中，我将假设你可以编写基本的数据库代码，并将重点主要放在 Atlas 及其功能上。

我们首先查看自动生成的 Default.aspx 文件，其中包含一个 **Atlas Script Manager**。我们将把脚本管理器重命名为 **“MyScriptManager”**。完成此操作后，我们将开始更改脚本管理器的属性。以下代码对此进行了说明：

 10 <asp:ScriptManager ID="MyScriptManager" 
           EnablePartialRendering="true" runat="server" />

如果您注意到上面的代码，EnablePartialRendering=True basically allows ASP.NET to render parts of the Default.aspx page when an event/postback occurs, instead of forcing ASP.NET to re-render the entire page.（启用部分渲染=True）基本上允许 ASP.NET 在事件/回发发生时渲染 Default.aspx 页面的部分内容，而不是强制 ASP.NET 重新渲染整个页面。

既然我们已经指定了希望在回发时只刷新页面的部分内容，那么我们就需要指定要刷新的部分，以及指定什么会触发这些部分的刷新。为了实现这一点，我们使用 Update Panels。Update Panel 通常包含一个 ContentTemplate 部分和一个 Trigger 部分。以下部分说明了一个只有 ContentTemplate 而没有触发器的 UpdatePanel。ContentTemplate 可以被认为是 DIV，它将包含需要在面板更新时刷新的 HTML。

 10 <asp:ScriptManager ID="MyScriptManager" 
       EnablePartialRendering="true" runat="server" />   
 11 <asp:UpdatePanel runat="server" id="MyUpdatePannel">
 12   <ContentTemplate>
 13   </ContentTemplate>    
 14 </asp:UpdatePanel>

ContentTemplate 几乎可以包含任何 HTML/服务器端控件。然而，在本例中，我决定放置一个 Label，它将显示当前的系统日期/时间。显示时间将允许我们展示一个 AJAX 实现场景，其中数据（或者像我们这里的时间）每秒钟都在变化，而无需编写样板数据库交互和 GridView 代码。

尽管在实际应用程序中，您通常会在 ContentTemplate 中放置像 GridView 这样的数据控件，但显示时间的 Label 有助于保持这个“Hello World”程序简单，并专注于最终目标——让 Atlas 发挥作用！

所以，我们快速地将一个 Label 控件放入 ContentTemplate 中（可以使用设计器或代码窗口）。完成此操作后，我们的代码应该看起来像这样：

 11 <asp:UpdatePanel runat="server" id="MyUpdatePannel">
 12   <ContentTemplate>
 13     <asp:Label ID="lblCurrentTime" 
               runat="server"></asp:Label>
 14   </ContentTemplate>
 15 </asp:UpdatePanel>

现在我们有一个显示当前时间的标签了，我们需要展示数据（或者在本例中是时间）在不刷新整个页面的情况下发生变化。为了说明这一点，让我们快速地在窗体上放置一个按钮，这样我们就可以在单击按钮时更新时间，而无需刷新页面。

 22 <asp:Button ID="btnShowCurrentTime" 
          runat="server" Text="Show Current Time" />

下一步是指定 UpdatePanel 需要在发生某些事情时刷新。这个“某些事情”可以是触发的控件的事件，也可以是已更改的控件的属性值。我们希望在 newly created button btnShowCurrentTime 的 Click 事件触发时发生面板刷新。让我们使用触发器来指定这一点。以下代码说明了这一点：

 11 <asp:UpdatePanel runat="server" id="MyUpdatePannel">
 12   <ContentTemplate>
 13     <asp:Label ID="lblCurrentTime" runat="server"></asp:Label>
 14   </ContentTemplate>
 15   <Triggers>
 16     <asp:AsyncPostBackTrigger 
               ControlID="btnShowCurrentTime" EventName="Click" />
 17   </Triggers>
 18 </asp:UpdatePanel>

在上面的代码中，我们只是添加了一个触发器，当 btnShowCurrentTime 按钮的单击事件被触发时，它将被异步触发。接下来，我们要通过单击我们刚刚创建的按钮来演示在回发时整个页面**不会**被刷新。当我们单击这个新创建的按钮时，触发的回发应该只导致 UpdatePanel 被刷新。

为了演示回发时整个页面**不会**被刷新，我们继续添加另一个标签，它也显示当前的系统日期/时间，但这次是在面板**外面**。

这样做的目的是为了证明，通过这个新创建的按钮引起的回发，面板内的标签会不断变化——因为面板会不断刷新，而面板外的标签则不会改变——因为整个页面没有被刷新。所以，让我们在页面上再放置一个标签，并将其命名为 lblPageTime。

 22 <asp:Label ID="lblFormTime" runat="server"></asp:Label>

我们几乎完成了。在代码隐藏文件中，我们只需用简单的代码实现页面 Load 事件，将两个标签的 Text 属性更新为当前的系统时间。

 14 protected void Page_Load(object sender, EventArgs e)
 15 {
 16     lblCurrentTime.Text = "This Could Be A Data Control" +  
 17        " That Needs To Be Refreshed" + 
 18        "<br /> We're going to keep this" + 
           " simple and illustrate change of data by showing"
 19       + "<br /> The Current System Date / Time. "
 20       + "<br /> The  Current Time is:" + System.DateTime.Now;	
 21 
 22     lblFormTime.Text = 
           "This is The Part Of The Page That is NOT supposed"
 23        + "<br /> refresh on post back's created by the button!"
 24        + "<br /> The  Current Time is:" + System.DateTime.Now;
 25 
 26 }

现在，当我们运行刚刚完成的示例时，第一次运行时会得到以下输出：

请注意，单击按钮如何更新/刷新面板中的数据（现在显示最新时间），而不是页面其余部分的数据（仍然显示应用程序启动时捕获的时间）。

显示进度...

我在早期阶段尝试使用非微软自定义的 AJAX 实现时遇到的许多问题，都是因为它支持多线程，并且需要手动处理大量关于服务器处理开始或结束的通知。有了 Atlas，我惊喜地发现跟踪异步处理以及显示动画 GIF 来表示进度是多么容易。

让我们用上面的例子来说明这一点。在上面的例子中，我们将使用一个动画 GIF 和文字“正在更新…”并使其显示，直到我们能够从服务器获取当前时间。为了实现这一点，我们使用 UpdateProgress 控件并指定一个图像，当我的服务器正在处理请求时将会显示该图像。以下代码对此进行了说明：

 20 <asp:UpdateProgress ID="myUpdateProgress" runat="server">
 21   <ProgressTemplate>
 22     <img src="Update.gif" />
 23   </ProgressTemplate>
 24 </asp:UpdateProgress>

现在，为了模拟一个可能需要几秒钟才能执行的长进程，我们让线程休眠几秒钟。

 15 protected void Page_Load(object sender, EventArgs e)
 16 {
 17 
 18   lblCurrentTime.Text = 
        "This Could Be A Data Control That Needs To Be Refreshed"
 19     + "<br /> We're going to keep this" + 
        " simple and illustrate change of data by showing"
 20     + "<br /> The Current System Date / Time. "
 21     + "<br /> The  Current Time is:" + System.DateTime.Now;
 22 
 23   lblFormTime.Text = 
        "This is The Part Of The Page That is NOT supposed"
 24     + "<br /> refresh on post back's created by the button!"
 25     + "<br /> The  Current Time is:" + 
        System.DateTime.Now;
 26 
 27   // BAD Code - Don't Try This on a Production

      // System - Just Trying to illustrate

      // Long Running Server Query

 28   Thread.Sleep(5000);  
 29 }

完成了。让我们快速运行应用程序！第一次运行大约需要五秒钟——这当然是因为我们强制线程休眠了五秒钟。然而，之后每一次单击更新按钮，都会显示更新图像，并允许我们通知用户服务器处理仍在进行中。

下一步？

既然我们已经编写了第一个 Atlas 程序，在下一篇文章中，我们将继续研究控件的条件渲染，这相当简单，然后将学习 Atlas Control Toolkit。

本文是否会随着 Atlas 新版本的发布而更新？

随着 Atlas 进入发布阶段，本文可能会进行更新。所有更新都将在此处以及 这里 发布。请随时将您的评论/建议/问题发送至 rajivpopat@gmail.com。