ASPNET Ajax中能够在客户端js中很方便地调用服务器Webservice以下为一些调用的示例笔者安装的ASPNET AJAX
版本为AJAX November CTP
三个示例分别为
带参数的WS方法
不带参数的WS方法
参数类型为DataTable的WS方法
一WebMethod
注意要点
WebMethod类需要添加命名空间 MicrosoftWebScriptServices此空间需要引用MicrosoftWebPreviewdll
类声明加入标签 [ScriptService]
在 里可以直接用DataTable作为返回类型了但是需要在nfig文件添加序列化转换器的属性DataSetDataTableDataRow均有转换器
<systemwebextensions>
<scripting>
<webServices>
<jsonSerialization>
<converters>
<add name=DataSetConverter type=MicrosoftWebPreviewScriptSerializationConvertersDataSetConverter MicrosoftWebPreview/>
<add name=DataRowConverter type=MicrosoftWebPreviewScriptSerializationConvertersDataRowConverter MicrosoftWebPreview/>
<add name=DataTableConverter type=MicrosoftWebPreviewScriptSerializationConvertersDataTableConverter MicrosoftWebPreview/>
</converters>
</jsonSerialization>
</webServices>
</scripting>
</systemwebextensions>
WEB服务WS
using System;
using SystemWeb;
using SystemCollections;
using SystemWebServices;
using SystemWebServicesProtocols;
using MicrosoftWebScriptServices;
using SystemData;
/**//// <summary>
/// WS 的摘要说明
/// </summary>
[WebService(Namespace = )]
[WebServiceBinding(ConformsTo = WsiProfilesBasicProfile_)]
[ScriptService]
public class WS : SystemWebServicesWebService {
public WS () {
//如果使用设计的组件请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public string ServerTime()
{
return StringFormat(now {} DateTimeNow);
}
[WebMethod]
public DataTable GetDataTable()
{
DataTable dt = new DataTable(Person);
dtColumnsAdd(new DataColumn(Name typeof(string)));
dtColumnsAdd(new DataColumn(LastName typeof(string)));
dtColumnsAdd(new DataColumn(Email typeof(string)));
dtRowsAdd(kui he );
dtRowsAdd(ren chao );
return dt;
}
}
WEB服务WS
using System;
using SystemWeb;
using SystemCollections;
using SystemWebServices;
using SystemWebServicesProtocols;
using MicrosoftWebScriptServices;
/**//// <summary>
/// WS 的摘要说明
/// </summary>
[WebService(Namespace = )]
[WebServiceBinding(ConformsTo = WsiProfilesBasicProfile_)]
[ScriptService]
public class WS : SystemWebServicesWebService {
public WS () {
//如果使用设计的组件请取消注释以下行
//InitializeComponent();
}
[WebMethod]
[ScriptMethod(UseHttpGet = true)]
public string HelloWorld(String query)
{
string inputString = ServerHtmlEncode(query);
if (!StringIsNullOrEmpty(inputString))
{
return StringFormat(hello {} inputString);
}
else
{
return query string is null or empty;
}
}
}
二前台页面
注意要点
需要使用的后台WebService的方法均设置在如下位置
<asp:ScriptManager ID=ScriptManager runat=server>
<Services>
<asp:ServiceReference Path=~/WSasmx />
<asp:ServiceReference Path=~/WSasmx />
</Services>
</asp:ScriptManager>
Default页面
<%@ Page Language=C# AutoEventWireup=true CodeFile=Defaultaspxcs Inherits=_Default %>
<!DOCTYPE html PUBLIC //WC//DTD XHTML //EN >
<html xmlns=>
<head runat=server>
<title>Untitled Page</title>
<script language=javascript type=text/javascript src=jsjs>
</script>
</head>
<body>
<form id=form runat=server>
<asp:ScriptManager ID=ScriptManager runat=server>
<Services>
<asp:ServiceReference Path=~/WSasmx />
<asp:ServiceReference Path=~/WSasmx />
</Services>
</asp:ScriptManager>
<div>
<asp:Button ID=Button runat=server Text=Button OnClientClick=dd();return false; />
<div id=time>
</div>
<div id=List>
<asp:DropDownList ID=ddl runat=server Width=px>
</asp:DropDownList>
</div>
</div>
</form>
</body>
</html>
三JavaScript程序:
注意要点
AJAX November CTP 需要用 eval() 方法将其转换成一个DataTable对象(并且要裁掉最前面的()而AJAX December CTP 支持以下方法转换SysPreviewDataDataTableparseFromJson(result)
function dd()
{
WSHelloWorld(
hekui
function(result)
{
alert(result);
}
);
WSServerTime(
function(result)
{
alert(result);
var divTime = documentgetElementById(time);
divTimeinnerHTML = result;
}
);
WSGetDataTable(
function(result)
{
// 获取到下拉框控件
var List = documentgetElementById(ddl);
//AJAX November CTP 需要用 eval() 方法将其转换成一个DataTable对象(并且要裁掉最前面的()
var Text= resultdataArraysubstring(resultdataArraylength );
var Table = eval( Text);
//AJAX December CTP 支持以下方法转换
// var Table = SysPreviewDataDataTableparseFromJson(result);
//清除下拉框原有列表项
for (x=Listoptionslength; x > ; x)
{
Listremove();
}
//从获取的DataTable添加数据到下拉框列表项
for (x=; x < Tablelength; x++ )
{
//获取每一行
var Row = Table[x];
//创建一个列表项
var option = documentcreateElement(option);
//列表项显示文本赋值
optiontext = RowName + + RowLastName;
//列表项选项值赋值
optionvalue = RowEmail;
//判断浏览器类型进行项目添加
if ( windownavigatorappNametoLowerCase()indexOf(microsoft) > )
Listadd(option);
else
Listadd(option null);
}
}
);
}
示例代码
