VS2017用EF+WebApi做一个简单的增删改查

一、首先,先新建一个项目,选择空的WebApi项目


然后,我们在Models创建一个类,用EF在前端搭建一个表(我的这个表名是叫Staff)

    public class Staff
    {
        [Key]
        [Required]
        public int Ids { get; set; }
        public string Name { get; set; }
        public string Pwd { get; set; }
        public string NikeName { get; set; }
    }

在创建一个类,用来连接数据库(我的是Staffcontext)

    public class StaffContext : DbContext
    {
        public StaffContext() : base("StaffContext") { }
        public DbSet<Staff> Staff { get; set; }
    }

我们在web.config里面插入

  <connectionStrings>
    <add name="StaffContext"  connectionString="Data Source=.;Initial Catalog=Staff;Persist Security Info=True;User ID=sa;Password=123;MultipleActiveResultSets=True;" providerName="System.Data.SqlClient" />
  </connectionStrings>

插入后就可以用程序包管理控制台来创建数据库表格了

首先输入 : Enable-Migrations

运行完毕后输入 : Add-Migration 注: Name随便起名字

运行完毕后输入: Update-Database 

这样就搭建完毕了

二、我们在Controllers文件夹里创建一个HomeControllers的控制器  


注:App_Start中的WebApiConfig.cs中只留一句话

            // Web API 路由
            config.MapHttpAttributeRoutes();

然后我们就可以在这里面写逻辑了

  [RoutePrefix("api/Home")] //定位到这个控制器
    public class HomeController : ApiController
    {
        Staff[] Staff = new Staff[]
        {
            new Staff{Ids=1,Name="zhangsan",Pwd="123",NikeName="张三" },
            new Staff{Ids=2,Name="lisi",Pwd="123",NikeName="李四"}
        };
        [Route("")]
        public IEnumerable<Staff> getall() //查询全部数据
        {
            StaffContext se = new StaffContext();
            IEnumerable<Staff> sf = se.Staff.AsEnumerable();
            return sf;
        }
        [Route("{ids:int}")] //从前端接收一个int类型的ids进行查询
        public IHttpActionResult get(int ids)
        {
            StaffContext se = new StaffContext();
            var s = se.Staff.FirstOrDefault(r => r.Ids == ids);
            if (s == null)
            {
                return NotFound();
            }
            else
            {
                return Ok(s);
            }

        }
        [Route("~/api/{Name}/Staff")] //从前端接收一个Name进行查询删除
        [HttpGet] //得到数据发送请求
        public void delete(string name)
        {
            using (StaffContext se = new StaffContext())
            {
                Staff s = se.Staff.Where(r => r.Name == name).FirstOrDefault();
                se.Staff.Remove(s);
                se.SaveChanges();
            }
        }
        [Route("{Names}/{Pwds}/{NikeNames}")] //从前端接收三个参数,添加到数据库表格内
        [HttpGet] //得到数据发送请求
        public void post(string Names, string Pwds, string NikeNames)
        {
            StaffContext se = new StaffContext();
            Staff s = new Staff { Name = Names, Pwd = Pwds, NikeName = NikeNames };
            se.Staff.Add(s);
            se.SaveChanges();
        }
        [Route("~/api/{uname:string}/Staff/{unick}/{upwd}")] //从前端接收三个参数进行修改,第一个uname为查询参数,后两个为要修改的参数
        [HttpGet] //得到数据发送请求
        public void update(string unick, string uname, string upwd)
        {
            StaffContext se = new StaffContext();
            Staff s = se.Staff.FirstOrDefault(r => r.Name == uname);
            s.NikeName = unick;
            s.Pwd = upwd;
            se.SaveChanges();
        }
    }

三、在前端搭建,在随意一个地方添加个HTML页面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <ul id="ul"></ul>
    <input type="text" id="txt" />
    <input type="button" value="查找" id="find" />
    <h1 id="h1"></h1>
    <input type="text" id="txt2" />
    <input type="button" value="删除" id="dele" /><br /><br />
    用户名:<input type="text" id="Names" /><br />
    密码:<input type="text" id="Pwds" /><br />
    昵称:<input type="text" id="NikeNames" />
    <input type="button" value="添加" id="insert" /><br /><br />
    请输入您要修改的人的用户名:<input type="text" id="uname" /><br />
    请输入您要修改的人的昵称:<input type="text" id="unick" /><br />
    请输入您要修改的人的密码:<input type="text" id="upwd" />
    <input type="button" id="update" value="修改" />
</body>
</html>
<script src="jquery1.11.1.min.js"></script>
<script>
    load();
    function load() {
        $.getJSON("api/Home")
            .done(function (data) {
                $.each(data, function (key, item) {
                    $("#ul").append($("<li>", { text: item.Name + "-" + item.Pwd + "-" + item.NikeName }))
                })
            })
    }
    $("#find").click(function () {
        $.getJSON("api/Home/" + $("#txt").val())
            .done(function (data) {
                $("#h1").html(data.Name + "--" + data.NikeName)
            })
            .fail(function (jqXHR, Status, err) {
                $("#h1").html("Error" + err)
            })
    })
    $("#dele").click(function () {
        $.getJSON("api/" + $("#txt2").val() + "/Staff")
            .done(function () {
                alert("删除成功!")
                window.location = location;
            })
    })
    $("#insert").click(function () {
        $.getJSON("api/Home/" + $("#Names").val() + "/" + $("#Pwds").val() + "/" + $("#NikeNames").val())
            .done(function () {
                alert("添加成功!")
                window.location = location;
            })
    })
    $("#update").click(function () {
        $.getJSON("api/" + $("#uname").val() + "/Staff" + $("#unick").val() + "/" + $("#upwd").val())
            .done(function () {
                alert("修改成功!")
                window.location = location;
            })
    })

</script>

  • 6
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值