扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
     ASP.NET 2.0 AJAX中能够在客户端js中很方便地调用服务器Webservice,以下为一些调用的示例。笔者安装的ASP.NET 2.0 AJAX 
   
  版本为AJAX November CTP。 
   
  三个示例分别为: 
  1 带参数的WS方法 
  2 不带参数的WS方法 
  3 参数类型为DataTable的WS方法 
   
  一、WebMethod 
  注意要点: 
  1 WebMethod类需要添加命名空间 Microsoft.Web.Script.Services,此空间需要引用Microsoft.Web.Preview.dll 
  2 类声明加入标签 [ScriptService] 
  3 在Asp.net 2.0里可以直接用DataTable作为返回类型了,但是需要在Web.config文件添加序列化转换器的属性。DataSet、DataTable、DataRow均有转换器 
   
   <system.web.extensions> 
   <scripting> 
   <webServices> 
   <jsonSerialization> 
   <converters> 
   <add name="DataSetConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataSetConverter, Microsoft.Web.Preview"/> 
   <add name="DataRowConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataRowConverter, Microsoft.Web.Preview"/> 
   <add name="DataTableConverter" type="Microsoft.Web.Preview.Script.Serialization.Converters.DataTableConverter, Microsoft.Web.Preview"/> 
   </converters> 
   </jsonSerialization> 
   </webServices> 
   </scripting> 
   </system.web.extensions> 
  WEB服务1:WS1 
   
  using System; 
  using System.Web; 
  using System.Collections; 
  using System.Web.Services; 
  using System.Web.Services.Protocols; 
  using Microsoft.Web.Script.Services; 
  using System.Data; 
  /**//// <summary> 
  /// WS1 的摘要说明 
  /// </summary> 
  [WebService(Namespace = "http://tempuri.org/")] 
  [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
  [ScriptService] 
  public class WS1 : System.Web.Services.WebService { 
   
   public WS1 () { 
   
   //如果使用设计的组件,请取消注释以下行 
   //InitializeComponent(); 
   } 
   
   [WebMethod] 
   public string ServerTime() 
   { 
   return String.Format("now: {0}", DateTime.Now); 
   } 
   
   [WebMethod] 
   public DataTable GetDataTable() 
   { 
   DataTable dt = new DataTable("Person"); 
   
   dt.Columns.Add(new DataColumn("Name", typeof(string))); 
   dt.Columns.Add(new DataColumn("LastName", typeof(string))); 
   dt.Columns.Add(new DataColumn("Email", typeof(string))); 
   
   dt.Rows.Add("kui", "he", "hekui168@163.com"); 
   dt.Rows.Add("ren", "chao", "chaoren888@163.com"); 
   
   return dt; 
   } 
  } 
   
   
  WEB服务2:WS 
   
  using System; 
  using System.Web; 
  using System.Collections; 
  using System.Web.Services; 
  using System.Web.Services.Protocols; 
  using Microsoft.Web.Script.Services; 
   
  /**//// <summary> 
  /// WS 的摘要说明 
  /// </summary> 
  [WebService(Namespace = "http://tempuri.org/")] 
  [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
  [ScriptService] 
  public class WS : System.Web.Services.WebService { 
   
   public WS () { 
   
   //如果使用设计的组件,请取消注释以下行 
   //InitializeComponent(); 
   } 
   
   [WebMethod] 
   [ScriptMethod(UseHttpGet = true)] 
   public string HelloWorld(String query) 
   { 
   string inputString = Server.HtmlEncode(query); 
   if (!String.IsNullOrEmpty(inputString)) 
   { 
   return String.Format("hello, {0}. ", inputString); 
   } 
   else 
   { 
   return "query string is null or empty"; 
   } 
   } 
   
  } 
   
   
  二、前台页面: 
  注意要点: 
  需要使用的后台WebService的方法均设置在如下位置 
   
   <asp:ScriptManager ID="ScriptManager1" runat="server"> 
   <Services> 
   <asp:ServiceReference Path="~/WS.asmx" /> 
   <asp:ServiceReference Path="~/WS1.asmx" /> 
   </Services> 
   </asp:ScriptManager> 
  Default页面: 
   
  <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
   
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
  <html xmlns="http://www.w3.org/1999/xhtml"> 
  <head runat="server"> 
   <title>Untitled Page</title> 
   
   <script language="javascript" type="text/javascript" src="js.js"> 
   </script> 
   
  </head> 
  <body> 
   <form id="form1" runat="server"> 
   <asp:ScriptManager ID="ScriptManager1" runat="server"> 
   <Services> 
   <asp:ServiceReference Path="~/WS.asmx" /> 
   <asp:ServiceReference Path="~/WS1.asmx" /> 
   </Services> 
   </asp:ScriptManager> 
   <div> 
   <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="dd();return false;" /> 
   <div id="time"> 
   </div> 
   <div id="List1"> 
   <asp:DropDownList ID="ddl1" runat="server" Width="187px"> 
   </asp:DropDownList> 
   </div> 
   
   </div> 
   </form> 
  </body> 
  </html> 
   
  三、JavaScript程序: 
  注意要点: 
  AJAX November CTP 需要用 eval() 方法将其转换成一个DataTable对象(并且要裁掉最前面的"("),而AJAX December CTP 支持以下方法转换“Sys.Preview.Data.DataTable.parseFromJson(result)” 
   
   function dd() 
   { 
   WS.HelloWorld( 
   'hekui', 
   function(result) 
   { 
   alert(result); 
   } 
   ); 
   WS1.ServerTime( 
   function(result) 
   { 
   alert(result); 
   var divTime = document.getElementById("time"); 
   divTime.innerHTML = result; 
   } 
   ); 
   WS1.GetDataTable( 
   function(result) 
   { 
   // 获取到下拉框控件 
   var List = document.getElementById("ddl1"); 
   
   //AJAX November CTP 需要用 eval() 方法将其转换成一个DataTable对象(并且要裁掉最前面的"(") 
   var Text= result.dataArray.substring(0,result.dataArray.length -1); 
   var Table = eval( Text); 
   
   //AJAX December CTP 支持以下方法转换 
  // var Table = Sys.Preview.Data.DataTable.parseFromJson(result); 
   
   //清除下拉框原有列表项 
   for (x=List.options.length-1; x > -1; x--) 
   { 
   List.remove(0); 
   } 
   
   //从获取的DataTable添加数据到下拉框列表项 
   for (x=0; x < Table.length; x++ ) 
   { 
   //获取每一行 
   var Row = Table[x]; 
   //创建一个列表项 
   var option = document.createElement("option"); 
   //列表项显示文本赋值 
   option.text = Row.Name + " " + Row.LastName; 
   //列表项选项值赋值 
   option.value = Row.Email; 
   
   //判断浏览器类型,进行项目添加 
   if ( window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) 
   List.add(option); 
   else 
   List.add(option, null); 
   } 
   } 
   ); 
   } 
  示例代码:http://www.cnblogs.com/Files/heekui/AJAXStudy.rar 
  http://www.cnblogs.com/heekui/archive/2007/01/10/616332.html
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。