Jquery ajax传递复杂参数给WebService的实现代码


Posted in Javascript onAugust 08, 2011

Entity:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Runtime.Serialization; 
namespace Entity 
{ 
[DataContract] 
public class User 
{ 
[DataMember] 
public string Name 
{ 
get; 
set; 
} 
[DataMember] 
public int Age 
{ 
get; 
set; 
} 
} 
}

WebService:
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Services; 
using Entity; 
namespace JQuery.Handler 
{ 
[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
[System.ComponentModel.ToolboxItem(false)] 
[System.Web.Script.Services.ScriptService] 
public class UserService1 : System.Web.Services.WebService 
{ 
[WebMethod] 
public string ComplexType(User hero,List<User> users) 
{ 
return hero.Name + " has " + users.Count + " people!"; 
} 
} 
}

Html:
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Ajax</title> 
<script src="../Scripts/jquery-1.6.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
$("#btnWeb").click(function () { 
$.ajax( 
{ 
type: "post", 
url: "../Handler/UserService.asmx/ComplexType", 
dataType:"json", 
contentType:"application/json", 
data: '{"hero": {"Name":"zhoulq","Age":27},"users":[{"Name":"zhangs","Age":22},{"Name":"wangw","Age":26},{"Name":"liuj","Age":25}, 
{"Name":"luos","Age":24}]}', 
success: function (data) { $("#web").text(data.d); } 
}); 
}); 
}); 
</script> 
</head> 
<body> 
<input id="btnWeb" type="button" value="请求WebService" /><label id="web"></label> 
</body> 
</html>
Javascript 相关文章推荐
菜单效果
Oct 14 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
Feb 10 Javascript
js完美解决IE6不支持position:fixed的bug
Apr 24 Javascript
js识别uc浏览器的代码
Nov 06 Javascript
jQuery插件学习教程之SlidesJs轮播+Validation验证
Jul 12 Javascript
Vue 按键修饰符处理事件的方法
May 04 Javascript
微信小程序提交form操作示例
Dec 30 Javascript
JS实现可用滑块滑动的缓动图代码
Sep 01 Javascript
vue封装swiper代码实例解析
Oct 08 Javascript
jquery检测上传文件大小示例
Apr 26 jQuery
微信公众号网页分享功能开发的示例代码
May 27 Javascript
在vue中封装方法以及多处引用该方法详解
Aug 14 Javascript
jquery学习笔记 用jquery实现无刷新登录
Aug 08 #Javascript
基于jQuery实现的水平和垂直居中的div窗口
Aug 08 #Javascript
关于hashchangebroker和statehashable的补充文档
Aug 08 #Javascript
基于jQuery的前端数据通用验证库
Aug 08 #Javascript
JS基础之undefined与null的区别分析
Aug 08 #Javascript
jQuery的12招常用技巧分享
Aug 08 #Javascript
利用javascript的面向对象的特性实现限制试用期
Aug 04 #Javascript
You might like
DC游戏Steam周三特惠 《蝙蝠侠》阿卡姆系列平史低
2020/04/09 欧美动漫
使用sockets:从新闻组中获取文章(二)
2006/10/09 PHP
php读取excel文件的简单实例
2013/08/26 PHP
Codeigniter实现处理用户登录验证后的URL跳转
2014/06/12 PHP
分享一段PHP制作的中文拼音首字母工具类
2014/12/11 PHP
PHP实现模拟http请求的方法分析
2017/12/20 PHP
Expandable &quot;Detail&quot; Table Rows
2007/08/29 Javascript
CSS+Table图文混排中实现文本自适应图片宽度(超简单+跨所有浏览器)
2009/02/14 Javascript
ie下动态加态js文件的方法
2011/09/13 Javascript
js页面跳转的常用方法整理
2013/10/18 Javascript
关闭页面window.location事件未执行的原因及解决方法
2014/09/01 Javascript
jQuery实现带有上下控制按钮的简单多行滚屏效果代码
2015/09/04 Javascript
javascript合并表格单元格实例代码
2016/01/03 Javascript
JS HTML5拖拽上传图片预览
2016/07/18 Javascript
AngularJS 获取ng-repeat动态生成的ng-model值实例详解
2016/11/29 Javascript
JQuery查找子元素find()和遍历集合each的方法总结
2017/03/07 Javascript
Vue中的v-for循环key属性注意事项小结
2018/08/12 Javascript
解决vue select当前value没有更新到vue对象属性的问题
2018/08/30 Javascript
微信小程序时间控件picker view使用详解
2018/12/28 Javascript
vue自定义指令之面板拖拽的实现
2019/04/14 Javascript
vue如何使用async、await实现同步请求
2019/12/09 Javascript
[40:05]DOTA2上海特级锦标赛A组小组赛#1 EHOME VS MVP.Phx第一局
2016/02/25 DOTA
Python random模块(获取随机数)常用方法和使用例子
2014/05/13 Python
Python logging模块学习笔记
2014/05/24 Python
Python设计实现的计算器功能完整实例
2017/08/18 Python
Python 实现Windows开机运行某软件的方法
2018/10/14 Python
Python面向对象编程基础实例分析
2020/01/17 Python
Python拼接字符串的7种方式详解
2020/03/19 Python
美国最值得信赖的宠物药房:Allivet
2019/03/23 全球购物
EJB面试题
2015/07/28 面试题
趣味活动策划方案
2014/02/08 职场文书
机械设计制造及其自动化专业求职信
2014/06/17 职场文书
2015年“七七卢沟桥事变”纪念活动总结
2015/03/24 职场文书
党员转正申请报告
2015/05/15 职场文书
离婚案件被告代理词
2015/05/23 职场文书
mongodb的安装和开机自启动详细讲解
2021/08/02 MongoDB