2022年6月5号前后端的数据交换技术项目实 *** 六:

2022年6月5号前后端的数据交换技术项目实 *** 六:,第1张

2022年6月四号电商平台网站系统(增删改查一级二级联动) 第一部分:查询 *** 作:

    商品管理系统
    
        

一级目录:   

二级目录:    

编号 商品名称 买点 售价 数量 更新日期 增加一条记录 修改一条记录 删除一条记录
 $(function () {
            $.ajax({
                url: "list.do",
                type: "GET",
                data: "",
                success: function (json) {
                    //在数据还没有放入表格前 表格零食存放
                    html = $("table").html();
                    //list集合 [{},{},{},{},{}]
                    //    解析数据
                   
                },
                error: function () {
                    alert("请求失败")
                },
                dataType: "json"


            });

        });
  @RequestMapping("list.do")
    @ResponseBody
    public Object getList() {
//    System.out.println("开始查询数据");
//    商品表中信息
        List> list = service.getList();
//list集合 [{},{},{},{},{}]
//    一级目录数据
        List ones = service.getOnes();
//    将数据封装成map集合
        Map map = new HashMap<>();
        map.put("ones", ones);
        //{list:[{}{}{}],"one":["","",""]
        map.put("list", list);
        return ;

    }
package Com.Day0604.Service;

import java.util.List;
import java.util.Map;

/**
 * 业务层接口
 */
public interface IItemService {
    List> getList();

    List getOnes();

    List getTwo(String one);

    List> getFoos(String two);

    int getDel(int id);

    int add(Map map);

    Map getToUpdateId(int id);

    int UpdateInt(Map map);
}

    @Override
    public List> getList() {
        return dao.getList();
    }
  @Select("select * from item")
    List> getList();
 //    定义方法
    @RequestMapping("list.do")
    @ResponseBody
    public Object getList() {
//    System.out.println("开始查询数据");
//    商品表中信息
        List> list = service.getList();
//list集合 [{},{},{},{},{}]
//    一级目录数据
        List ones = service.getOnes();
//    将数据封装成map集合
        Map map = new HashMap<>();
        map.put("ones", ones);
        //{list:[{}{}{}],"one":["","",""]
        map.put("list", list);
        return map;

    }
//    定义方法解析json格式
        function parseTable(json) {
            //将表格数据清除
            $("table").empty();
            $("table").html(html)
            for (var i = 0; i < json.length; i++) {
                $("table").append("" +
                    "" + json[i].id + "" +
                    "" + json[i].title + "" +
                    "" + json[i].sell_point + "" +
                    "" + json[i].price + "" +
                    "" + json[i].num + "" +
                    "" + json[i].updated + "" +
                    "" +
                    "" +
                    "" +
                    "")
            }

        }
 $(function () {
            $.ajax({
                url: "list.do",
                type: "GET",
                data: "",
                success: function (json) {
                    //在数据还没有放入表格前 表格零食存放
                    html = $("table").html();
                    //list集合 [{},{},{},{},{}]
                    //    解析数据
                    // parseTable(json);
                    parseTable(json.list);
                    parseOne(json.ones);
                },
                error: function () {
                    alert("请求失败")
                },
                dataType: "json"


            });

        });

第一点:查询数据的核心要义:
     *  如果用户要查整张表的信息要做以下分析
     * 1 表中查到的是一条记录 那你又可以这样做 在java中定义了 Map集合 Map
     * 2 如果查到的是两条记录或者是多条记录 外表用到是list集合  里面是MAP集合
     * 3所以多条记录利用的是 list中调用map集合  List> getCarList()
     * 如果用户查询表的一个字段 中有多条记录
     * 1多条记录利用List集合 一个字段利用的是String存放
     * 2所以使用的是list中调用String    List 

第二部分:增加 *** 作.


   //定义方法跳到增加页面上
        function add() {
            confirm("开始增加用户的一条记录")
            alert("开始前往增加数据的页面")
            location.href = "add.html"
        }


    增加记录页面
    


    @ResponseBody
    @RequestMapping("toUpdateId")
    public Object toUpdateId(HttpSession session) {
        int id = (int) session.getAttribute("id");
        Map map = service.getToUpdateId(id);
        return map;

    }
Map getToUpdateId(int id);
 @Override
    public Map getToUpdateId(int id) {
        return dao.getToUpdateId(id);
    }
@Select("SELECT * FROM item  WHERE id=#{id}")
    Map getToUpdateId(@Param("id") int id);

 /*UPDATE `testdb`.`item` SET `id` = 9, `title` = '洗头水', `sell_point` = '互黑', `price` = 283, `num` = 24, `updated` = '2022-05-04 19:37:46', `cid` = 4 WHERE `id` = 8*/
    @Update("UPDATE `testdb`.`item` SET title = #{title},sell_point = #{sell_point},price = #{price}, num = #{num},updated = #{updateed},cid = #{cid} WHERE id = #{id}")
    int updateInt(Map map);
   @Override
    public int UpdateInt(Map map) {
        return dao.updateInt(map);
    }
int UpdateInt(Map map);
  @RequestMapping("UpdateInt.do")
    public String UpdateInt(@RequestParam Object title,
                            @RequestParam String sell_point,
                            @RequestParam int price,
                            @RequestParam int num,
                            @RequestParam String updated,
                            @RequestParam int cid, HttpSession session) {

        Map map = new HashMap<>();
        int id = (int) session.getAttribute("id");
        map.put("id",id);
        map.put("title", title);
        map.put("sell_point", sell_point);
        map.put(" price", price);
        map.put("num", num);
        map.put("updated", updated);
        map.put("cid", cid);
        int i=service.UpdateInt(map);
        return "index.html";
    }

 

 第四点:修改的核心要义:
     * 如果用户要修改一条一条记录  包含多个字段  同理在SSM框架中修改数据
     * 1 首先用户要将你要修改的是哪条记录的参数发到服务器中 然后服务器利用mvc三层原理最终将其转到数据库
     * 2 我查到的每一条记录 的存放方式是 Map
     * 3 所以 返回的类型为 Map 方法名称(转入的参数)
     * Map getInfoById(int id);
     * 4 将修改信息如何展示在页面上这里需要你的前端基础
     * 5 将浏览器修改后的信息返回到服务器 中到数据库中完成数据的修改
     * 6 将修改的信息利用Map封装起来
     * 所以 返回的类型为 int方法名称(转入的参数)
     *  int updateInfo(Map map);
     * 思考你要修改的是一条记录 而一条记录利用的是 Map 存放 返回一条记录的值为 int 类型 所以接口定义下面方案
     * int updateInfo(Map map);


第五部分:一级二级查询
先完成一级目录:


 $(function () {
            $.ajax({
                url: "list.do",
                type: "GET",
                data: "",
                success: function (json) {
                    //在数据还没有放入表格前 表格零食存放
                    html = $("table").html();
                    //list集合 [{},{},{},{},{}]
                    //    解析数据
                    // parseTable(json);
                    parseTable(json.list);
                    parseOne(json.ones);
                },
                error: function () {
                    alert("请求失败")
                },
                dataType: "json"


            });
  //    定义方法
    @RequestMapping("list.do")
    @ResponseBody
    public Object getList() {
//    System.out.println("开始查询数据");
//    商品表中信息
        List> list = service.getList();
//list集合 [{},{},{},{},{}]
//    一级目录数据
        List ones = service.getOnes();
//    将数据封装成map集合
        Map map = new HashMap<>();
        map.put("ones", ones);
        //{list:[{}{}{}],"one":["","",""]
        map.put("list", list);
        return map;

    }
 List> getList();

    List getOnes();
 @Override
    public List> getList() {
        return dao.getList();
    }

    @Override
    public List getOnes() {
        return dao.getOnes();
    }
   @Select("select * from item")
    List> getList();

    @Select("SELECT name FROM item_cat  WHERE is_parent=1")
    List getOnes();


二级目录查询


 //定义方法搜索
        function sea() {
            var two = $("input[name='two']").val();
            if (two != null) {
                $.ajax({
                    url: "search.do",
                    type: "GET",
                    data: "two=" + two,
                    success: function (json) {
                        parseTable(json);

                    },
                    error: function () {
                        alert("连接失败")
                    },
                    dataType: "json"
                })

            }
        }

 //    定义方方查找信息
    @RequestMapping("search.do")
    @ResponseBody
    public Object search(@RequestParam String two) {
        List> foos = service.getFoos(two);
//[{},{}]
        return foos;
    }
List> getFoos(String two);
  @Override
    public List> getFoos(String two) {
        return dao.getFoos(two);
    }
@Select("SELECT * FROM item WHERE cid=(SELECT id FROM item_cat  WHERE `name`=#{two} )")
    List> getFoos(@Param("two") String two);

欢迎分享,转载请注明来源:内存溢出

原文地址: https://www.outofmemory.cn/web/1323565.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-12
下一篇 2022-06-12

发表评论

登录后才能评论

评论列表(0条)

保存