ajax+webservice

版本為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.pswp.cn/news/389033.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/389033.shtml
英文地址，請注明出處：http://en.pswp.cn/news/389033.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！