- 加入购物车模块——实时更新数据库, 进行实时访问
Project.jsp 新加JS:
<script type="text/javascript">
//全局变量
//skuId
var skuId;
var colorId;
function jianshao() {
//页面验证:alert("减少");
var num =$("#buy-num").val();
if(Number(num)>1){
$("#buy-num").val(Number(num)-1);
}
}
function zengjia() {
//页面验证:alert("增加");
//获取购买上限
var upperlimit;
<c:forEach items="${skus}" var="sku">
//alert("skuid"+skuId+"库存列表id"+${sku.id});
if(skuId==${sku.id} ){
upperlimit=Number(${sku.upperLimit});
//alert(upperlimit);
}
</c:forEach>
var num =$("#buy-num").val();
if(Number(num)<upperlimit){
$("#buy-num").val(Number(num)+1);
}
}
function xianzhi() {
var num =Number($("#buy-num").val());//转换为数字
//1.输入<=0
if(num<=0){
$("#buy-num").val(1);
}
//2.输入>购买限制
//获取购买上限
var upperlimit;
<c:forEach items="${skus}" var="sku">
//alert("skuid"+skuId+"库存列表id"+${sku.id});
if(skuId== ${sku.id} ){
upperlimit=Number(${sku.upperLimit});
//alert(upperlimit);
}
</c:forEach>
if(num >upperlimit){
$("#buy-num").val(upperlimit);
}
}
//加入购物车——发ajax请求,到“/cart/addone”————jquery实现ajax请求
function addCart(){
//AJAX格式:$.post( url,data,function);
$.post("<%=basePath%>cart/addone",{
id:1,
buyerid:1,
productid:1,
num:100,
colorid:9,
sizename:'S',
babaprice:802,
price:698.81,
isdel:0,
//createtime: null
},function(){
//发送AJAX请求成功后的回调函数
});
}
</script>
- 加入购物车: Product.jsp中需要传到所买商品的id, name/…
- 新建数据库表bbs_cart
id值设置自动加一
3. com.demo.po中新建Cart.java添加Cart属性(名称与数据库相同)并添加 get、set、tostring方法
注意: 导包时导util包. - com.demo.dao中新建CartDao.java接口
package com.demo.dao;
import com.demo.po.Cart;
public interface CartDao {
//加入购物车——购物车表中添加信息
public void addone(Cart c);
}
- com.demo.mapper中新建CartMapper.xml
sql语句
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper SYSTEM "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
<mapper namespace="com.demo.dao.CartDao">
<insert id="addone" parameterType="com.demo.po.Cart">
insert into bbs_cart values(null,#{buyerid},#{productid},#{num},#{colorid},
#{sizename},#{babaprice},#{price},#{isdel},#{createtime})
</insert>
</mapper>
- com.demo.service中新建CartService.java(接口) 和CartServiceImpl.java(类)
CartService.java(接口)
package com.demo.service;
import com.demo.po.Cart;
public interface CartService {
//加入购物车的方法
public void addone(Cart c);
}
CartServiceImpl.java(类)
package com.demo.service;
import org.mybatis.generator.codegen.ibatis2.dao.DAOGenerator;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.demo.dao.CartDao;
import com.demo.po.Cart;
@Service
public class CartServiceImpl implements CartService{
@Autowired
CartDao dao;
@Override
public void addone(Cart c) {
// TODO Auto-generated method stub
dao.addone(c);
}
}
- com.demo.action中新建CartController.java
package com.demo.action;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import com.demo.po.Cart;
import com.demo.service.CartService;
@Controller
@RequestMapping("/cart")
public class CartController {
@Autowired
CartService service;
@RequestMapping("/addone")
public String addone(Cart c)
{
//用set, get方法得到c
System.out.println(c);
service.addone(c);
//jsp的名字
return "aaa";
}
}
- JS:主要的标签
html标签——(改内容、文本)对 input和select不好用), 对 div a li / …好用
val标签——获取修改值 用法: var num =$("#buy-num").val();
- Ajax: 页面上的局部刷新, 需要发Ajax请求(通过JS代码实现)——jquery实现ajax请求简便
实现: jsp页面到Controller.java中
运用: post方法 $.post(url,data,callback,type)
url: 请求往哪里发——string类型
data: 等待发送的参数——map
callback: 发送成功后,的回调函数 ——function
type: 返回内容的格式——string (通常不写)
- 普通请求的种类:
直接改变地址
链接点击,跳转页面
登陆界面(表单提交) 点登陆