JQuery AJAX调用WEB SERVICE方法
2015-12-16 09:21
573 查看
类定义
WEB SERVICE定义
调用页面
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JQuery AJAX调用各种WEB SERVICE</title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
//不带参数调用
$('#callWithNoParameter').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/HelloWorld',
data: '{}',
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
event.preventDefault();
});
//带参数调用
$('#callWithParameter').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetHello',
data: '{yourName:"李四",age:25}',
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
event.preventDefault();
});
//返回类实例对象
$('#getClassInstance').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetEmployeeEntity',
data: '{}',
dataType: 'json',
success: function (result) {
$(result.d).each(function () {
alert('你的姓名是:' + this['EmployeeName'] + ' 生日是:' + this['Birthday']);
});
}
});
event.preventDefault();
});
//返回集合
$('#getList').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetList',
data: '{}',
dataType: 'json',
success: function (result) {
$(result.d).each(function () {
alert(this.toString());
});
}
});
event.preventDefault();
});
//返回DataSet
$('#getDataSet').click(function (event) {
$.ajax({
type: 'POST',
url: 'http://localhost:8117/Service1.asmx/GetDataSet',
data: '{}',
dataType: 'xml',
success: function (result) {
try {
$(result).find('employeeTable').each(function () {
alert(
'姓名=' + $(this).find('EmployeeName').text() + ';' +
'年龄=' + $(this).find('Age').text() + ';' +
'生日=' + $(this).find('Birthday').text());
});
}
catch (e) {
alert(e);
}
},
error: function (result, status) {
alert(status);
}
});
event.preventDefault();
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<button id="callWithNoParameter">不带参数调用</button>
<button id="callWithParameter">带参数调用</button>
<button id="getClassInstance">获得类实例</button>
<button id="getList">获得集合</button>
<button id="getDataSet">获得DataSet</button>
</div>
</form>
</body>
</html>
/// <summary> /// 员工信息 /// </summary> public class EmployeeEntity{ /// <summary> /// 员工姓名 /// </summary> public string EmployeeName{get;set;} /// <summary> /// 生日 /// </summary> public string Birthday{get;set;} }
WEB SERVICE定义
/// <summary> /// JQuery测试服务 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] [System.Web.Script.Services.ScriptService] public class Service1 : System.Web.Services.WebService{ /// <summary> /// 不含参数测试 /// </summary> /// <returns>返回Hello World</returns> 4000 [WebMethod] public string HelloWorld(){ return "Hello World"; } /// <summary> /// 带参数测试 /// </summary> /// <param name="yourName">你的姓名</param> /// <param name="age">年龄</param> /// <returns>返回一段问候</returns> [WebMethod] public string GetHello(string yourName, int age){ return string.Format("Hello {0} , your age is {1}", yourName, age); } /// <summary> /// 获得类实例 /// </summary> /// <returns>员工信息实体</returns> [WebMethod] public EmployeeEntity GetEmployeeEntity(){ return new EmployeeEntity(){ EmployeeName = "张三", Birthday = "2000-07-12" }; } /// <summary> /// 获得集合对象 /// </summary> /// <returns>集合对象</returns> [WebMethod] public List<string> GetList(){ List<string> countryList = new List<string>(); countryList.Add("中国"); countryList.Add("美国"); countryList.Add("法国"); countryList.Add("德国"); return countryList; } /// <summary> /// 获得DataSet /// </summary> /// <returns>DataSet对象</returns> [WebMethod] public DataSet GetDataSet(){ DataSet dataSet = new DataSet(); DataTable dataTable = new DataTable("employeeTable"); dataTable.Columns.AddRange(new DataColumn[]{ new DataColumn("EmployeeName",typeof(string)), new DataColumn("Age",typeof(int)), new DataColumn("Birthday",typeof(string)) }); dataTable.Rows.Add(new object[] { "李白", "63", "1320-05-06" }); dataTable.Rows.Add(new object[] { "王刚", "60", "1920-05-06" }); dataTable.Rows.Add(new object[] { "李毅", "53", "1820-05-06" }); dataSet.Tables.Add(dataTable); return dataSet; } }
调用页面
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JQuery AJAX调用各种WEB SERVICE</title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
//不带参数调用
$('#callWithNoParameter').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/HelloWorld',
data: '{}',
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
event.preventDefault();
});
//带参数调用
$('#callWithParameter').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetHello',
data: '{yourName:"李四",age:25}',
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
event.preventDefault();
});
//返回类实例对象
$('#getClassInstance').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetEmployeeEntity',
data: '{}',
dataType: 'json',
success: function (result) {
$(result.d).each(function () {
alert('你的姓名是:' + this['EmployeeName'] + ' 生日是:' + this['Birthday']);
});
}
});
event.preventDefault();
});
//返回集合
$('#getList').click(function (event) {
$.ajax({
type: 'POST',
contentType: 'application/json',
url: 'http://localhost:8117/Service1.asmx/GetList',
data: '{}',
dataType: 'json',
success: function (result) {
$(result.d).each(function () {
alert(this.toString());
});
}
});
event.preventDefault();
});
//返回DataSet
$('#getDataSet').click(function (event) {
$.ajax({
type: 'POST',
url: 'http://localhost:8117/Service1.asmx/GetDataSet',
data: '{}',
dataType: 'xml',
success: function (result) {
try {
$(result).find('employeeTable').each(function () {
alert(
'姓名=' + $(this).find('EmployeeName').text() + ';' +
'年龄=' + $(this).find('Age').text() + ';' +
'生日=' + $(this).find('Birthday').text());
});
}
catch (e) {
alert(e);
}
},
error: function (result, status) {
alert(status);
}
});
event.preventDefault();
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<button id="callWithNoParameter">不带参数调用</button>
<button id="callWithParameter">带参数调用</button>
<button id="getClassInstance">获得类实例</button>
<button id="getList">获得集合</button>
<button id="getDataSet">获得DataSet</button>
</div>
</form>
</body>
</html>
相关文章推荐
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- 5个常见可用性错误和解决方案
- 解决Ajax悬停效果,无法遮蔽FLASH的问题
- 再谈Jquery Ajax方法传递到action(补充)
- js可突破windows弹退效果代码
- Dom在ajax技术中的作用说明
- C#.NET获取拨号连接的宽带连接方法
- C#.Net ArrayList的使用方法
- JSP脚本漏洞面面观
- 基于jquery实现一个滚动的分步注册向导-附源码
- 使用Ajax实时检测"用户名、邮箱等"是否已经存在
- 使用BAT一句话命令实现快速合并JS、CSS
- js显示当前星期的起止日期的脚本
- 探讨Ajax中同步与异步之间的区别
- PowerShell中使用.NET将程序集加入全局程序集缓存
- .net(c#)中的new关键字详细介绍
- 由vbs sort引发.NET Framework之间的关系说明
- 爆炸式的JS圆形浮动菜单特效代码
- C#难点逐个击破(6):C#数据类型与.net framework数据类型