AJAX 调用WebService 、WebApi 增删改查
WebService 页面:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
/// <summary> /// TsetWeb 的摘要说明 /// </summary> [WebService(Namespace = "http://tempuri.org/" )] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem( false )] // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消注释以下行。 [System.Web.Script.Services.ScriptService] public class TsetWeb : System.Web.Services.WebService { TestBll bll = new TestBll(); [WebMethod(Description = "获取所有对象信息" )] public string AllUserJson() { return ToJson(bll.GetAllUser()); } [WebMethod(Description = "添加一个对象信息" )] public string SetUserJson( string name , string phone) { return ToJson(bll.SetAddUser(name,phone)); } [WebMethod(Description = "删除一个对象信息" )] public string DelUserJson( int id) { return ToJson(bll.DelUser(id)); } [WebMethod(Description = "更改一个对象信息" )] public string Update( int id, string name, string phone) { Test user = new Test(); user.id = id; user.name = name; user.phone = phone; return ToJson(bll.Update(user)); } //对数据序列化,返回JSON格式 public string ToJson( object obj) { JavaScriptSerializer serializer = new JavaScriptSerializer(); return serializer.Serialize(obj); } } |
AJAX调用WebService 页面:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
<body> <form id= "form1" runat= "server" > <div> <table id= "tab" > <tr> <td>编号</td> <td>名字</td> <td>电话</td> <th>操作</th> </tr> </table> </div> <input type= "button" name= "add" id= "add" value= "添加" /> </form> <script src= "Scripts/jquery-1.7.1.min.js" ></script> <script> $(function() { $.ajax({ url: "/TsetWeb.asmx/AllUserJson" , contentType: 'application/json' , dataType: "json" , type: "post" , success: function(data) { var a = eval( "(" + data.d + ")" ); //后台返回是字符串,所以转换为json对象 $.each(a, function(index, item) { var tr = $( "<tr/>" ); $( "<td/>" ).html(item[ "id" ]).appendTo(tr); $( "<td/>" ).html(item[ "name" ]).appendTo(tr); $( "<td/>" ).html(item[ "phone" ]).appendTo(tr); $( "<button id ='d' onclick='del(" + item[ "id" ] + ")'>" ).html( "删除" ).appendTo(tr); $( "<button id ='u' onclick='updata(" + item[ "id" ] + ")'>" ).html( "更新" ).appendTo(tr); tr.appendTo( "#tab" ); }); }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); }); $( "#add" ).click(function() { $.ajax({ url: "/TsetWeb.asmx/SetUserJson" , data: "{name:'李六',phone:'13727713819'}" , contentType: 'application/json' , dataType: "json" , type: "post" , success: function (data) { var a = eval( "(" + data.d + ")" ); //后台返回是字符串,所以转换为json对象 alert(a); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); }); function del(id) { $.ajax({ url: "/TsetWeb.asmx/DelUserJson" , type: "Post" , data: { "id" : id }, dataType: "json" , success: function (data) { var a = eval( "(" + data.d + ")" ); //后台返回是字符串,所以转换为json对象 alert(a); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); } function updata(id) { $.ajax({ url: "/TsetWeb.asmx/Update" , type: "Post" , data: { "id" : id, "name" : '九九' , "phone" : '15927713819' }, dataType: "json" , success: function (data) { var a = eval( "(" + data.d + ")" ); //后台返回是字符串,所以转换为json对象 alert(a); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); } </script> </body> |
AJAX调用WebService结果:
WebApi页面:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
public class ValuesController : ApiController { TestBll bll = new TestBll(); // GET api/values/GetAll() [HttpGet] public List<Test> GetAll() { return bll.GetAllUser(); } [HttpPost] public int PostNew([FromBody]Test user) { return bll.SetAddUser(user.name, user.phone); } [HttpPost] public int PostNew( string name , string phone) { return bll.SetAddUser(name, phone); } [HttpDelete] public int Delete([FromBody]Test user) { return bll.DelUser(user.id); } [HttpPut] public int Put([FromBody] Test user) { return bll.Update(user); } } |
AJAX调用WebApi页面:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
<div> <table id= "tab" > <tr> <th>编号</th> <th>名字</th> <th>电话</th> <th>操作</th> </tr> </table> <input type= "button" name= "add" id= "add" value= "添加" /> </div> <script src= "~/Scripts/jquery-1.7.1.min.js" ></script> <script> $(function() { $.ajax({ url: "api/Values/GetAll" , type: "GET" , dataType: "json" , success: function(data) { $.each(data, function(index, item) { var tr = $( "<tr/>" ); $( "<td/>" ).html(item[ "id" ]).appendTo(tr); $( "<td/>" ).html(item[ "name" ]).appendTo(tr); $( "<td/>" ).html(item[ "phone" ]).appendTo(tr); $( "<button id ='d' onclick='del(" + item[ "id" ] + ")'>" ).html( "删除" ).appendTo(tr); $( "<button id ='u' onclick='updata(" + item[ "id" ] + ")'>" ).html( "更新" ).appendTo(tr); tr.appendTo( "#tab" ); }); }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); }); $( "#add" ).click(function () { $.ajax({ url: "api/Values/Put" , type: "Put" , data: { "id" :id, "name" : '赵七' , "phone" : '15727713819' }, dataType: "json" , success: function (data) { alert(data); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); }); function del(id) { $.ajax({ url: "api/Values/Delete" , type: "Delete" , data: { "id" : id }, dataType: "json" , success: function (data) { alert(data); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); } function updata(id) { $.ajax({ url: "api/Values/Put" , type: "Put" , data: { "id" : id, "name" : '黄八' , "phone" : '15927713819' }, dataType: "json" , success: function (data) { alert(data); //返回1表示成功 }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest + "," + textStatus + "," + errorThrown); } }); } </script> |
AJAX调用WebApi结果:
AJAX 调用WebService 、WebApi 增删改查的更多相关文章
- jQuery调用WebService实现增删改查的实现
第一篇博客,发下我自己写的jQuery调用WebService实现增删改查的实现. 1 <!DOCTYPE html> 2 3 <html xmlns="http://ww ...
- MVC3.0+knockout.js+Ajax 实现简单的增删改查
MVC3.0+knockout.js+Ajax 实现简单的增删改查 自从到北京入职以来就再也没有接触MVC,很多都已经淡忘了,最近一直在看knockout.js 和webAPI,本来打算采用MVC+k ...
- MVC3+EF5.0 code first+Flexigrid+ajax请求+jquery dialog 增删改查
MVC3+EF5.0 code first+Flexigrid+ajax请求+jquery dialog 增删改查 本文的目的: 1.MVC3项目简单配置EF code first生成并初始化数据 ...
- C#利用WinForm调用WebServices实现增删改查
实习导师要求做一个项目,用Winform调用WebServices实现增删改查的功能.写下这篇博客,当做是这个项目的总结.如果您有什么建议,可以给我留言.欢迎指正. 1.首先,我接到这个项目的时候,根 ...
- AJAX 调用WebService 、WebApi 增删改查(笔记)
经过大半天努力,终于完成增删改查了!心情有点小激动!!对于初学者的我来说,一路上都是迷茫,坑!!虽说网上有资料,可动手起来却不易(初学者的我).(苦逼啊!) WebService 页面: /// &l ...
- ASP.NET WebApi 增删改查
本篇是接着上一篇<ASP.NET WebApi 入门>来介绍的. 前言 习惯说 CRUD操作,它的意思是"创建. 读取. 更新和删除"四个基本的数据库操作.许多 HTT ...
- WebApi增删改查Demo
1.新建webapi项目 2.配置WebApiConfig public const string DEFAULT_ROUTE_NAME = "MyDefaultRoute"; p ...
- ajax——优化0126(增删改查:添加查看详情,返回结果类型为JSON型,在窗口显示)
效果: 鼠标点击查看详情时 数据库: 0126.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
- 关于MVC工厂模式的增删改查sql存储过程
这里MVC中用到了反射,工厂,泛型,接口 在搭建框架的时候,除了MVC的三层以外,还有泛型的接口层和工厂层 下面是dal层调用sql存储过程,增删改查,dal层继承了接口层,实现了接口层里面的方法 1 ...
随机推荐
- php foreach 无法改变数组的值的问题
转:http://www.cnblogs.com/yangwenxin/p/5845212.html 翻到PHP文档的foreach那页这样写道: “foreach 语法结构提供了遍历数组的简单方式. ...
- 【转载】 准人工智能分享Deep Mind报告 ——AI“元强化学习”
原文地址: https://www.sohu.com/a/231895305_200424 ------------------------------------------------------ ...
- ubuntu挂载新硬盘
root@luo-All-Series:~# fdisk -lDisk /dev/loop0: 320.2 MiB, 335728640 bytes, 655720 sectorsUnits: sec ...
- 手机wifi连上Fiddler后无网络问题解决
早上老板交代一个任务,对一款app抓包分析下接口调用的时延.我的重新打开了一年多前用过的Fiddler(参见win10笔记本用Fiddler对手机App抓包),拿过测试手机开始设置wifi代理地址和端 ...
- 数据分析入门——IPython入门
一.什么是IPython IPython的开发者吸收了标准解释器的基本概念,在此基础上进行了大量的改进,创造出一个令人惊奇的工具.在它的主页上是这么说的:“这是一个增强的交互式Python shell ...
- python flask框架学习(二)——第一个flask程序
第一个flask程序 学习自:知了课堂Python Flask框架——全栈开发 1.用pycharm新建一个flask项目 2.运行程序 from flask import Flask # 创建一个F ...
- 编译Flink 1.9.0
闲来无事,编个Flink 1.9 玩玩 1.下载flink.flink-shaded 源码.解压 flink flink-shaded 7.0 [venn@venn release]$ ll tota ...
- 最基础的Python的socket编程入门教程
最基础的Python的socket编程入门教程 本文介绍使用Python进行Socket网络编程,假设读者已经具备了基本的网络编程知识和Python的基本语法知识,本文中的代码如果没有说明则都是运行在 ...
- 使用sql语句创建和删除约束示例代码
使用sql语句创建和删除约束 约束类型 主键约束(Primary Key constraint) --:要求主键列数据唯一,并且不允许为空. 唯一约束(Unique constraint) --: ...
- 如何在Windows Server 2008 R2中更改桌面图标
如何在Windows Server 2008 R2中更改桌面图标 Windows Server 2008 R2 已经在 MSDN 和 TechNet Plus 订阅上公布,gOxiA 在第一时间下载并 ...