很早就想触及一下MS的Atlas,么时间啊么时间的说,现在时间多的是了,哈哈
先是安装了Visual Studio Atlas插件,然后就按照asp.net上的Atlas Quickstart做了个玩玩,简单的Hello World反馈服务器时间程序。
Web Service代码:
Default.aspx代码:
OK了,这个例子很简单,就是通过按键时间触发Javascript的DoSearch事件,而这个DoSearch事件就是调用Web Service查询服务器时间至OnRequestComplete事件进行用户反馈。整个过程中页面没有刷新。通过这个例子对大致的Ajax应该有所了解了哈,嘻嘻。
先是安装了Visual Studio Atlas插件,然后就按照asp.net上的Atlas Quickstart做了个玩玩,简单的Hello World反馈服务器时间程序。
Web Service代码:
1<%@ WebService Language="VB" Class="Samples.AspNet.HelloWorldService" %>
2
3Imports System.Web
4Imports System.Web.Services
5Imports System.Web.Services.Protocols
6
7Namespace Samples.AspNet
8<WebService(Namespace:="http://tempuri.org/")> _
9<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
10 Public Class HelloWorldService
11 Inherits System.Web.Services.WebService
12 <WebMethod()> _
13 Public Function HelloWorld(ByVal query As String) As String
14 Dim inputString As String = Server.HtmlEncode(query)
15 If Not String.IsNullOrEmpty(inputString) Then
16 Return String.Format("Hello, you queried for {0}. The " _
17 & "current time is {1}", inputString, DateTime.Now)
18 Else
19 Return "The query string was null or empty"
20 End If
21 End Function
22 End Class
23End Namespace
2
3Imports System.Web
4Imports System.Web.Services
5Imports System.Web.Services.Protocols
6
7Namespace Samples.AspNet
8<WebService(Namespace:="http://tempuri.org/")> _
9<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
10 Public Class HelloWorldService
11 Inherits System.Web.Services.WebService
12 <WebMethod()> _
13 Public Function HelloWorld(ByVal query As String) As String
14 Dim inputString As String = Server.HtmlEncode(query)
15 If Not String.IsNullOrEmpty(inputString) Then
16 Return String.Format("Hello, you queried for {0}. The " _
17 & "current time is {1}", inputString, DateTime.Now)
18 Else
19 Return "The query string was null or empty"
20 End If
21 End Function
22 End Class
23End Namespace
Default.aspx代码:
1<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" Title="Atlas Script Walkthrough" %>
2
3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
4 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
5
6<script type="text/javascript">
7
8 function DoSearch()
9 {
10 var SrchElem = document.getElementById("SearchKey");
11 Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value, OnRequestComplete);
12 }
13
14 function OnRequestComplete(result)
15 {
16 var RsltElem = document.getElementById("Results");
17 RsltElem.innerHTML = result;
18 }
19
20</script>
21
22<html xmlns="http://www.w3.org/1999/xhtml">
23
24 <head id="Head1" runat="server">
25 <atlas:ScriptManager runat="server" ID="scriptManager">
26 <services>
27 <atlas:servicereference path="~/HelloWorldService.asmx" />
28 </services>
29 </atlas:ScriptManager>
30 <style type="text/css">
31 body { font: 11pt Trebuchet MS;
32 font-color: #000000;
33 padding-top: 72px;
34 text-align: center }
35
36 .text { font: 8pt Trebuchet MS }
37 </style>
38
39 </head>
40 <body>
41 <form id="Form2" runat="server">
42 <div>
43 Search for
44 <input id="SearchKey" type="text" />
45 <input id="SearchButton" type="button" value="Search"
46 onclick="DoSearch()" />
47 </div>
48 </form>
49 <hr style="width: 300px" />
50 <div>
51 <span id="Results"></span>
52 </div> </body>
53</html>
2
3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
4 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
5
6<script type="text/javascript">
7
8 function DoSearch()
9 {
10 var SrchElem = document.getElementById("SearchKey");
11 Samples.AspNet.HelloWorldService.HelloWorld(SrchElem.value, OnRequestComplete);
12 }
13
14 function OnRequestComplete(result)
15 {
16 var RsltElem = document.getElementById("Results");
17 RsltElem.innerHTML = result;
18 }
19
20</script>
21
22<html xmlns="http://www.w3.org/1999/xhtml">
23
24 <head id="Head1" runat="server">
25 <atlas:ScriptManager runat="server" ID="scriptManager">
26 <services>
27 <atlas:servicereference path="~/HelloWorldService.asmx" />
28 </services>
29 </atlas:ScriptManager>
30 <style type="text/css">
31 body { font: 11pt Trebuchet MS;
32 font-color: #000000;
33 padding-top: 72px;
34 text-align: center }
35
36 .text { font: 8pt Trebuchet MS }
37 </style>
38
39 </head>
40 <body>
41 <form id="Form2" runat="server">
42 <div>
43 Search for
44 <input id="SearchKey" type="text" />
45 <input id="SearchButton" type="button" value="Search"
46 onclick="DoSearch()" />
47 </div>
48 </form>
49 <hr style="width: 300px" />
50 <div>
51 <span id="Results"></span>
52 </div> </body>
53</html>
OK了,这个例子很简单,就是通过按键时间触发Javascript的DoSearch事件,而这个DoSearch事件就是调用Web Service查询服务器时间至OnRequestComplete事件进行用户反馈。整个过程中页面没有刷新。通过这个例子对大致的Ajax应该有所了解了哈,嘻嘻。