SpringMvc+Spring+MyBatis+Maven+Ajax+Json注解开发 利用Maven的依赖导入不使用架包模式 (实操十)_星辰镜的博客-CSDN博客
上面的博客是环境配置和Mysql的操作
本文章的目标 完成对数据库中表的数据查序
MySql查序语句:SELECT * FROM orders
分析表中的数据用java的方式如何存放
原始的三层架构没有写代码的情况没有写查询的功能代码的情况下
控制层
@Autowired定义:
@Autowired是一种注解，可以对成员变量、方法和构造函数进行标注，来完成自动装配的工作，@Autowired标注可以放在成员变量上，也可以放在成员变量的set方法上，也可以放在任意方法上表示，自动执行当前方法，如果方法有参数，会在IOC容器中自动寻找同类型参数为其传值
IOrderService service;
上面的作用相当于在控制层中注入Service层的数据
package Com.Orders.Controller; /** * SpringMvc 控制层 部分代码省略 */ @Controller public class OrderController { @Autowired IOrderService service; }
业务逻辑层
@Autowired定义:
@Autowired是一种注解，可以对成员变量、方法和构造函数进行标注，来完成自动装配的工作，@Autowired标注可以放在成员变量上，也可以放在成员变量的set方法上，也可以放在任意方法上表示，自动执行当前方法，如果方法有参数，会在IOC容器中自动寻找同类型参数为其传值
IOrderDao dao;
上面的作用相当于Service层中注入Dao层的数据
ackage Com.Orders.Service; import java.util.List; import java.util.Map; /** * 业务逻辑层的接口 */ public interface IOrderService { }
package Com.Orders.Service; /** * 业务逻辑层接口的实现类去实现接口未实现的方法 */ @Service(value = "sService") public class OrderServiceImp implements IOrderService { @Autowired IOrderDao dao; }
数据访问层
对数据库的数据进行查序
package Com.Orders.Dao; import org.apache.ibatis.annotations.Param; import org.apache.ibatis.annotations.Select; import org.apache.ibatis.annotations.Update; import java.util.List; import java.util.Map; /** * 数据反问层操作数据的增删改查 */ public interface IOrderDao { }
查询数据库的表中数据的代码
定义一个页面为首页
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>首页内容</title> </head> <body> <div align="center"> <h1>2022/9/19商品管理系统</h1> <a href="Service.html" style="font-size: 20px">点击这里进入查询页面的信息</a> </div> </body> </html>
查询功能的数据跳到Service.html页面:
<a href="Service.html" style="font-size: 20px">点击这里进入查询页面的信息</a>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>查询页面信息</title> <style type="text/css"> *{ font-family: 楷体; font-size: 30px; } input{ background-color: beige; color: red; border-radius: 12px; } </style> <script src="js/jquery-3.2.1.min.js"></script> </head> <body> <div align="center"> <h1>查询数据库中的信息页面</h1> <table> <tr> <th>订单编号</th> <th>用户名</th> <th>商品名称</th> <th>订单时间</th> <th>数量</th> <th>单价</th> <th>金额</th> <th>操作</th> </tr> </table> </div> </body> </html>
当我们点击超链接的时候跳转到查序功能的页面
查询数据库中的信息页面结果
查询数据库表中的数据信息
在Service.html中定义Ajax请求
<script> //Ajax请求访问 $(function () { $.ajax({ url: "list.do", type: "GET", data: "", success: function (json) { parsTale(json); }, error: function () { alert("用户已经连接失败") }, dataType: "json" }) }) </script>
控制层
@RequestMapping("list.do") @ResponseBody public Object list() { //因为查询的数据信息是多条记录 //所以 在Java中用 List<Map<String, String>> List<Map<String, String>> list = service.getList(); }
业务逻辑层
//Java存放的方式 方法名 List<Map<String, String>> getList();
数据访问层
// @Select("SELECT * FROM orders") 数据库的Sql语句 @Select("SELECT * FROM orders") List<Map<String, String>> getList();
查询书籍的信息结果返回到页面显示 使用Json解析
@RequestMapping("list.do") @ResponseBody public Object list() { List<Map<String, String>> list = service.getList(); return list; }
在Service.html中解析数据
// 定义方解析页面 function parsTale(jsons) { for (var i = 0; i < jsons.length; i++) { $("table").append("<tr>" + "<td>" + jsons[i].id + "</td>" + "<td>" + jsons[i].name + "</td>" + "<td>" + jsons[i].foondname + "</td>" + "<td>" + jsons[i].ordertime + "</td>" + "<td>" + jsons[i].count + "</td>" + "<td>" + jsons[i].price + "</td>" + "<td>" + jsons[i].amount + "</td>" + "<td><input type='button' onclick='update(" + jsons[i].id + ")' value='修改按钮'> " + "<input value='增加' type='button' onclick='add()'> " + "<input value='删除' type='button'></td>" + "</tr>") }
查询数据库中的信息页面结果
