用VS2005创建一个基本的Atlas Web应用(1) 作者: dengsu888666 发表日期: 2006-09-15 14:49 文章属性: 原创 复制链接 |
本文通过介绍Atlas的最新技术的使用,使你能够理解什么是Atlas技术,对学习Atlas有很大帮助。在这里你将要跟着我做一个基本的Atlas程序,下面的程序是使用Atlas控件通过客户端脚本远程调用Webservice,然后把结果显示到Web页面上,但不需要通过把页面提交到服务器端就可以完成。 在作这个例子之前,你首先要安装NET Framework version 2.0和Visual Studio 2005开发工具,另外还要安装Atlas的程序包,你可以到微软的网站下载Atlas的安装程序。Atlas安装完后,会在你的开发工具的新建网站对话框模版列表中显示一个”Atlas”Web Site的Atlas模版项。你先选择这个模版项建一个Atlas的Web网站。开发工具会自动产生一个配置好的Web.config文件。具体操作步骤如下: 1.选择“文件”----“新建“----“网站”菜单项 2.在新建网站对话框中,选择'Atlas' Web Site模版项 3.在“位置”选项中选择“文件系统”,选择一个路径和所用语言。然后确定。如下图 图11 4.打开解决方案资源管理器,选择当前解决方案,点击鼠标右键选择快捷菜单项“添加新项”,选择Web服务,并命名为HelloWorldService.asmx,选择语言,点击添加。 图22 在Web服务代码里添加一个HelloWorld方法,用于返回服务器日期和时间,这个方法的参数为string类型,返回值为按一定格式要求显示的string类型。完整的Web服务代码如下: C#代码如下: <%@ WebService Language="C#" Class="Samples.AspNet.HelloWorldService" %> using System; using System.Web; using System.Web.Services; using System.Web.Services.Protocols; namespace Samples.AspNet { [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class HelloWorldService : System.Web.Services.WebService { [WebMethod] public string HelloWorld(String query) { string inputString = Server.HtmlEncode(query); if(!String.IsNullOrEmpty(inputString)) { return String.Format("Hello, you queried for {0}. The " + "current time is {1}", inputString, DateTime.Now); } else { return "The query string was null or empty"; } } } } VB代码如下: <%@ WebService Language="VB" Class="Samples.AspNet.HelloWorldService" %> Imports System.Web Imports System.Web.Services Imports System.Web.Services.Protocols Namespace Samples.AspNet <WebService(Namespace:="http://tempuri.org/")> _ <WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _ Public Class HelloWorldService Inherits System.Web.Services.WebService <WebMethod()> _ Public Function HelloWorld(ByVal query As String) As String Dim inputString As String = Server.HtmlEncode(query) If Not String.IsNullOrEmpty(inputString) Then Return String.Format("Hello, you queried for {0}. The " _ & "current time is {1}", inputString, DateTime.Now) Else Return "The query string was null or empty" End If End Function End Class End Namespace 5.添加一个Web窗体,命名为AtlasScript.aspx,在添加Web窗体时不要选择“把代码放在单独的文件中”选择项。 6.切换到页代码浏览,复制下面代码粘贴到你的@Page标记下面。 1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3. 4. <html xmlns="http://www.w3.org/1999/xhtml"> 5. 6. <head id="Head1" runat="server"> 7. <atlas:ScriptManager runat="server" ID="scriptManager"> 8. <services> 9. <atlas:servicereference path="~/HelloWorldService.asmx" /> 10. </services> 11. </atlas:ScriptManager> 12. <style type="text/css"> 13. body { font: 11pt Trebuchet MS; 14. font-color: #000000; 15. padding-top: 72px; 16. text-align: center } 17. 18. .text { font: 8pt Trebuchet MS } 19. </style> 20. 21. </head> 22. <body> 23. <form runat="server"> 24. <div> 25. Search for 26. <input id="SearchKey" type="text" /> 27. <input id="SearchButton" type="button" value="Search" 28. οnclick="DoSearch()" /> 29. </div> 30. </form> 31. <hr style="width: 300px" /> 32. <div> 33. <span id="Results"></span> 34. </div> </body> 35. </html> 在上面的代码中有一个很重要的Atlas控件ScriptManager,, 它用来处理页面上的所有Atlas组件以及局部页面的更新,并生成相关的客户端脚本,在ScriptManager控件中声明了要调用的Web服务的URL,没有这个声明,在脚本中将不能调用这个Web服务。关于ScriptManager,将在以后的文章中作详细介绍。 7.现在要添加调用Web服务的脚本代码。复制下面的脚本粘贴到AtlasScript.aspx中。这个脚本的主要作用是调用Web服务,然后把返回的结果显示到页面上。 1. <script type="text/javascript"> 2. 3. function DoSearch() 4. { 5. var SrchElem = document.getElementById("SearchKey"); 6. Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value, OnRequestComplete); 7. } 8. 9. function OnRequestComplete(result) 10. { 11. var RsltElem = document.getElementById("Results"); 12. RsltElem.innerHTML = result; 13. } 14. 15. </script> DoSearch脚本函数用于调用Web服务,把用户在TexBox中的输入值和OnRequestComplete回调函数传入Web服务HelloWorld方法,回调函数必须要有,因为是异步调用,必须要有一种机制通知客户端调用完成后的返回值。当异步调用Web方法完成后OnRequestComplete将会被调用。这个回调函数通过参数result获得返回值,这个返回值就是调用Web服务的方法.HelloWorld的返回值。 在@ Page下面完整的代码如下: 1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3. 4. <html xmlns="http://www.w3.org/1999/xhtml"> 5. 6. <head id="Head1" runat="server"> 7. <atlas:ScriptManager runat="server" ID="scriptManager"> 8. <services> 9. <atlas:servicereference path="~/HelloWorldService.asmx" /> 10. </services> 11. </atlas:ScriptManager> 12. <style type="text/css"> 13. body { font: 11pt Trebuchet MS; 14. font-color: #000000; 15. padding-top: 72px; 16. text-align: center } 17. 18. .text { font: 8pt Trebuchet MS } 19. </style> 20. 21. </head> 22. <body> 23. <form runat="server"> 24. <div> 25. Search for 26. <input id="SearchKey" type="text" /> 27. <input id="SearchButton" type="button" 28. value="Search" 29. οnclick="DoSearch()" /> 30. </div> 31. </form> 32. <hr style="width: 300px" /> 33. <div> 34. <span id="Results"></span> 35. </div> 36. <script type="text/javascript"> 37. 38. function DoSearch() 39. { 40. var SrchElem = document.getElementById("SearchKey"); 41. Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value, 42. OnRequestComplete); 43. } 44. 45. function OnRequestComplete(result) 46. { 47. var RsltElem = document.getElementById("Results"); 48. RsltElem.innerHTML = result; 49. } 50. 51. </script> 52. </body> 53. </html> 现在你可以运行AtlasScript.aspx进行测试了。运行后在Search for后的文本框中输入一些内容再点击Search按钮,可以看到调用Web服务方法HelloWorld的返回内容显示到了页面上,但整个页面并没有刷新,他和以往的Web程序相比,主要是在性能上有了很大的提升,这就是Ajax技术目前比较流行的一个主要原因。 我的下一篇文章:用VS2005创建一个Atlas Web应用程序(2) |
用VS2005创建一个基本的Atlas Web应用(1)
最新推荐文章于 2018-12-16 04:24:16 发布