多语言展示
当前在线:1036今日阅读:26今日分享:39

怎么做一个商品的购物车

就是一个商品的购物车,手动填写商品的数量,就可以显示出该商品的总价格,显示出整个购物车的总价格了,是一个小的案例了
工具/原料
1

PHP

2

ligerui

3

mysql

方法/步骤
1

购物车展示

2

购物车思路解析1:获取到用户购买的所有商品信息,像商品的单价,商品的数量2:通过表格显示出来商品的所有信息3:商品的价格Rmb处理,就是商品的单价*商品的数量4:商品的总价RmbSum,就是所有商品的Rmb之和5:商品的数量修改,由于是PHP了,所以商品数据已修改就保存在数据库了6:商品数量修改以后,重新获取商品的所有信息,重新赋值到表格里面,重新计算商品的价格

3

购物车的数据库,是一个小的案例了

5

数据库

6

购物车页面代码manager = window['car'] = $('#goodsCarList').ligerGrid({        rowHeight : 40,            columns: [             { display: '商品id号', name: 'goodsId', align: 'center' ,width: 90},//自增id                      { display: '商品名称', name: 'goodsName', align: 'center', width: 90,type:'text',editor: { type: 'text' } },             { display: '商品单价', name: 'sale', align: 'center',width: 90},             { display: '商品数量', name: 'count', width: 100,type:'int',isNegative:false,editor: { type: 'int' },                            },             { display: '商品小计', name: 'saleSum',width: 90,            render:function(row){ var saleSum = {}; saleSum=(row['sale'])*(row['count']); return saleSum; }                 }            ],            enabledEdit: true,            data: $.extend(true, {}, CustomersData),            pageSize: 10,            toolbar: { items: [                                                             { text: '删除', icon: 'delete' },                               { text: '修改', icon: 'modify' },                                                ]        },         onAfterEdit:updateCar,                });GetData();//获取购物车信息

7

1代码解释   { display: '商品小计', name: 'saleSum',width: 90,            render:function(row){var saleSum = {};//声明saleSum=(row['sale'])*(row['count']);//商品的价格*数量return saleSum;}                 }2 enabledEdit: true,和  { display: '商品数量', name: 'count', width: 100,type:'int',isNegative:false,editor: { type: 'int' },      设置了商品的数量是可以修改的

8

//获取全部购物车的数据 function GetData(){  $.ajax({        type: 'POST',        url: 'index.php/TestUser/GetGoodsCar',        error:function(mes){         $.ligerDialog.error('ajax获取购物车数据失败!');        },        success: function (html) {            CustomersData.Rows = eval(html);//获取后台的值            car.set({ data: CustomersData });//设置grid的值            GetSumSale();//设置总价格        }    }); }

9

数量修改展示

推荐信息