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 增删改查的更多相关文章

  1. jQuery调用WebService实现增删改查的实现

    第一篇博客,发下我自己写的jQuery调用WebService实现增删改查的实现. 1 <!DOCTYPE html> 2 3 <html xmlns="http://ww ...

  2. MVC3.0+knockout.js+Ajax 实现简单的增删改查

    MVC3.0+knockout.js+Ajax 实现简单的增删改查 自从到北京入职以来就再也没有接触MVC,很多都已经淡忘了,最近一直在看knockout.js 和webAPI,本来打算采用MVC+k ...

  3. MVC3+EF5.0 code first+Flexigrid+ajax请求+jquery dialog 增删改查

    MVC3+EF5.0 code first+Flexigrid+ajax请求+jquery dialog 增删改查 本文的目的:   1.MVC3项目简单配置EF code first生成并初始化数据 ...

  4. C#利用WinForm调用WebServices实现增删改查

    实习导师要求做一个项目,用Winform调用WebServices实现增删改查的功能.写下这篇博客,当做是这个项目的总结.如果您有什么建议,可以给我留言.欢迎指正. 1.首先,我接到这个项目的时候,根 ...

  5. AJAX 调用WebService 、WebApi 增删改查(笔记)

    经过大半天努力,终于完成增删改查了!心情有点小激动!!对于初学者的我来说,一路上都是迷茫,坑!!虽说网上有资料,可动手起来却不易(初学者的我).(苦逼啊!) WebService 页面: /// &l ...

  6. ASP.NET WebApi 增删改查

    本篇是接着上一篇<ASP.NET WebApi 入门>来介绍的. 前言 习惯说 CRUD操作,它的意思是"创建. 读取. 更新和删除"四个基本的数据库操作.许多 HTT ...

  7. WebApi增删改查Demo

    1.新建webapi项目 2.配置WebApiConfig public const string DEFAULT_ROUTE_NAME = "MyDefaultRoute"; p ...

  8. ajax——优化0126(增删改查:添加查看详情,返回结果类型为JSON型,在窗口显示)

    效果: 鼠标点击查看详情时 数据库: 0126.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...

  9. 关于MVC工厂模式的增删改查sql存储过程

    这里MVC中用到了反射,工厂,泛型,接口 在搭建框架的时候,除了MVC的三层以外,还有泛型的接口层和工厂层 下面是dal层调用sql存储过程,增删改查,dal层继承了接口层,实现了接口层里面的方法 1 ...

随机推荐

  1. jsch连接sftp后连接未释放掉问题排查

    项目中通过jsch中的sftp实现上传下载文件.在压测过程中,由于调用到sftp,下载文件不存在时,系统不断抛出异常,内存飙升,逐渐把swap区也占满,通过top监控未发现占用内存的进程,通过查找ss ...

  2. MiniUI treeGrid 动态加载数据与静态加载数据的区别

    说明:treegrid静态数据加载时数据结构是一棵树包含children节点集合,而采用动态加载数据时数据是List结构的具体项. 静态加载数据 test1.html <!DOCTYPE htm ...

  3. git如何删除远程tag?

    答: 分为两步: 1. 删除本地tag git tag -d tag-name 2. 删除远程tag git push origin :refs/tags/tag-name

  4. 小D课堂 - 零基础入门SpringBoot2.X到实战_第6节 SpringBoot拦截器实战和 Servlet3.0自定义Filter、Listener_24、深入SpringBoot过滤器和Servlet配置过滤器

    笔记 1.深入SpringBoot2.x过滤器Filter和使用Servlet3.0配置自定义Filter实战(核心知识)     简介:讲解SpringBoot里面Filter讲解和使用Servle ...

  5. php报错syntax error, unexpected T_GOTO, expecting T_STRING,报错文件与行数指向以下代码,是什么原因?

    本机php版本是5.3.8,Apache/2.2.21public function goto($url, $msg=NULL) {if ($msg) {$this->jsAlert($msg) ...

  6. Js/jQuery实时监听input输入框值变化

    前言在做web开发时候很多时候都需要即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.而采用onchange时间又往往是在输入框失去焦点(onblur)时候触发,有时候并不能满 ...

  7. [redis]带密码的客户端连接方法

    客户端连接方法: redis-cli -h localhost -p 6380 提供host为localhost,端口为6380   带密码的客户端连接方法一: redis-cli -h localh ...

  8. C++数据存储方式

    1.栈,就是那些由编译器在需要的时候分配,在不需要的时候自动清楚的变量的存储区,里面的变量通常是局部变量.函数参数等. 2.堆,就是那些由new分配的内存块,他们的释放编译器不去管,由我们的应用程序去 ...

  9. oracle数据库【表复制】insert into select from跟create table as select * from 两种表复制语句区别

    create table  as select * from和insert into select from两种表复制语句区别 create table targer_table as select ...

  10. 123457123456#1#----com.tym.DishuGame78--前拼后广--宝宝打地鼠_tym

    com.tym.DishuGame78--前拼后广--宝宝打地鼠_tym