zoukankan      html  css  js  c++  java
  • 商城项目之实战-购物车模块

    实现效果图

    用户添加多个订单信息,多个订单选择立即购买生成订单,关键点多选按钮传递选中的多个值到后台

    1.实体类

    /**
     * 购物车类
     */
    public class ShoppingCart {
        private int id;//购物车编号',
        private int uId;// '用户编号',
        private int cId;// 点卡编号',
        private String cName;// '点卡名称',数据库不存在此列
        private String titleImg;// '点卡图标',数据库不存在此列
        private int number;// '库存数量',,数据库不存在此列
        private Double iniPrice;//原价格',,数据库不存在此列
        private Double price;// 售价',,数据库不存在此列
        private int gid;// 游戏编号',
        private String    gName;//'游戏名称',',数据库不存在此列
        private int num;// 购买数量',
        private Double totalPrice;// 金额统计'


    2.js代码


    js定义一个类
    /**
     * 对象函数
     * @param cid
     * @param gid
     * @param price
     * @param gName
     * @param cName
     * @param byNum
     * @constructor
     */
    function Cards(id,cId,gid,price,gName,cName,num) {
        this.id=id;
        this.cId=cId;
        this.gid=gid;
        this.price=price;
        this.gName=gName;
        this.cName=cName;
        this.num=num;
    }

    //创建一个数组存贮对象
    var cards=new Array();
    /**
     * 选择购物车的商品提交订单
     */
    $("#payment").click(function() {
        var blackName = document.getElementsByName("cartCheckBox");
        var $total=$("#shopping").find("tr[id]");
        var k = 0;
        var serialArray="";
        for (var i = 0; i < blackName.length; i++) {
            if (blackName[i].checked == true) {
                k = k + 1;
                var obj=$total.eq(i+1);//前面多了一个id定位+1
                var card=new Cards(obj.children(".id").val(),obj.children(".cId").val(),obj.children(".gid").val(),obj.children(".price").val(),obj.children(".gName").val(),obj.children(".cName").val(),obj.children(".cart_td_6").children(".byNum").val());
                cards[k-1]=card;//数组下标从0开始
            }
        }
        if (k == 0) {
            changeDLGContent("请选择商品后再提交!");
            openYesOrNoDLG();
            return;
        }
        var jsonsa=JSON.stringify(cards);//将一个JavaScript值(对象或者数组)转换为一个 JSON字符串
        $.ajax({
            type: "POST",//请求类型
            url: path+"/toPaymentother",//请求的url
            data: jsonsa,//请求参数
            dataType: "json",//ajax接口(请求url)返回的数据类型
            success: function (data) {//data:返回数据(json对象)
                if (data>0) {
                    window.location.href=path+"/toPaymentOnly";
                }else {
                    changeDLGContent("添加订单失败!");
                    openYesOrNoDLG();
                }
            },
            error: function (data) {//当访问时候,404,500 等非200的错误状态码
                changeDLGContent("添加订单失败!");
                openYesOrNoDLG();
            }
        });
    3.springMVC后台接收
    import cn.jbit.biz.*;
    import cn.jbit.entity.*;
    import cn.jbit.util.Calculation;
    import cn.jbit.util.Pages;
    import com.alibaba.fastjson.JSON;
    import com.alibaba.fastjson.TypeReference;
    import org.apache.commons.io.IOUtils;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.*;
    
    import javax.annotation.Resource;
    import javax.servlet.http.HttpServletRequest;
    import java.io.IOException;
    import java.text.SimpleDateFormat;
    import java.util.ArrayList;
    import java.util.Date;
    import java.util.List;
     
    /**
     * 购物车跳转到提交订单页面
     * @return
     */
    @ResponseBody
    @RequestMapping(value = "/toPaymentother")
    public String toPaymentother(HttpServletRequest request) throws IOException{
        String jsonStr = IOUtils.toString(request.getInputStream(),"UTF-8");
        List<ShoppingCart> cardsListJson = JSON.parseObject(jsonStr, new TypeReference<List<ShoppingCart>>() {});
        System.out.println("JSONTOJAVAOBJ============"+cardsListJson);
        Double totalPir=0.0;
        int ret=0;
        if(cardsListJson.size()>0){
            ret=1;
            for (ShoppingCart c:cardsListJson) {
                c.setTotalPrice(Calculation.getDouble(c.getPrice(),c.getNum()));
                totalPir+=c.getTotalPrice();
            }
            request.getSession().setAttribute("totalPir",totalPir);
            request.getSession().setAttribute("cardsListJson",cardsListJson);
        }
        return JSON.toJSONString(ret);
    }
     
    4.springboot后台接收,不同项目

    js代码
    $.ajax({
        type: "POST",//请求类型
        url: path+"/offer/selectionDevice.html",//请求的url
        data:{SceneQuoteInfos:jsonsa},//请求参数,注意这里多了个SceneQuoteInfos
        dataType: "json",//ajax接口(请求url)返回的数据类型
        success: function (data) {//data:返回数据(json对象)
            if(data.message=="ok") {
                errerInformation(data.data,"javascript:void(0);");
            } else {
                errerInformation(data.data,"javascript:void(0);");
            }
        }
    });
    controller层
    @Business
    @ResponseBody
    @RequestMapping(value = "/selectionDevice.html",method = RequestMethod.POST)
    public String toSelectionDevice (@RequestParam("SceneQuoteInfos") String SceneQuoteInfos, HttpServletRequest request)throws IOException {
        List<SceneQuoteInfo> SceneQuoteInfo = JSON.parseObject(SceneQuoteInfos, new TypeReference<List<SceneQuoteInfo>>() {});
        System.out.println("SceneQuoteInfos============"+SceneQuoteInfos);
        return "business/selectionDevice";
    }
     
    
    


     
  • 相关阅读:
    c/c++ # and ## in macros以及宏debug
    postgresql unnamed statement
    postgresql/lightdb a [left/right] join b on true的含义
    openjdk、javafx各发行版
    lightdb for postgresql PL/pgSQL perform、execute、call区别
    postgresql有mysql兼容插件吗?
    各种互联网公司,不要再那么没有分寸的刷屏QPS/TPS/日活千万这些毫无意义的数据了
    PostgreSQL分布式数据库实践
    LightDB发布日常运维管理手册
    恒生电子发布金融分布式数据库LightDB
  • 原文地址:https://www.cnblogs.com/zeussbook/p/8895030.html
Copyright © 2011-2022 走看看