热门:网页模板.net视频教程JQueryMVCjsonExtJs源码示例三级联动JQuery菜单
您现在的位置:.Net中文社区>> AJAX编程>>正文内容

AJAX中Webservice调用方法

发布时间:2009年08月29日点击数: 未知

 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;

  /**////
  /// WS1 的摘要说明
  ///
  [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;

  /**////
  /// WS 的摘要说明
  ///
  [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的方法均设置在如下位置
Default页面:
三、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);
  }

  }

  );
  }

 

本站热点业务

更多模板/案例展示

关于我们 | 联系我们 | 团队日志 | 网站地图 | 网站合作