ajax修改购物车的例子

1的设计。车



ShoppingCartItem:本书的包装,包括图书名称、数量、价格三的属性,以及相应的getter和setter方法。

购物车:购物类项目的地图,并添加到购物车,三函数的总数量和总价格的购物车。

2:JSP添加到购物车中,将超链接添加到标题和价格中。







你已经
添加到购物车和购物车。
这本书的总价格是




java
<
href =$ { pageContext。请求。contextpath } / addtocartid = javaprice = 100 >加入购物车

Ajax
<
href =$ { pageContext。请求。contextpath } / addtocartid = ajaxprice = 200 >加入购物车

滑动分页
<
href =$ { pageContext。请求。contextpath } / addtocartid = jqueryprice = 300 >加入购物车





设计3:----- Servlet AddToCart

以下步骤如下:

1):获取请求参数ID(文本图书名),价格,这是在JSP页面中的超链接得到

2):在会话中获取购物车对象,如果会话属性中没有购物车,则在会话属性中放置一个新的购物车对象。

3):加入购物车操作shopping.addtocart(文本图书名、价格);

4):我们希望将JSON对象传递给Ajax。对象包括{文本图书名totalbooknumber

5):针对JSON请求,response.getwriter()打印(JSON);




公共课addtocartservlet扩展HttpServlet {

public void doGet(HttpServletRequest请求,HttpServletResponse响应)
抛出IOException {返回,
This.doPost(请求、响应);
}

public void doPost(HttpServletRequest请求,HttpServletResponse响应)
抛出IOException {返回,
/ / 1:获取请求参数标识(文本图书名),价格
字符串文本图书名= request.getparameter(ID);
产品价格= integer.parseint(request.getparameter(价格));
2:在会话中获取购物车对象
ShoppingCart SC =(shoppingcart)request.getsession()。GetAttribute(SC);
如果(= NULL){
SC =新的购物车();
request.getsession()。SetAttribute(SC
}

3;将单击的对象添加到购物车
Sc.addToCart(文本图书名、价格);
JSON对象 / / 4:准备回应:{ 'bookname ':' totalbooknumber ',' totalmoney}
如果从服务器返回JSON对象,则属性名必须使用双引号!!
创建一个新的StringBuilder()= StringBuilder;
SBuilder.append({)
。追加(文本图书名+文本图书名+ )
追加()
。追加(totalbooknumber + sc.gettotalbooknumber()+ )
追加()
。追加(totalmoney + sc.gettotalmoney()+ )
追加(});

请求响应
response.setcontenttype(文本/ javascript );
response.getwriter()打印(sbuilder.tostring());
}

}
其中StringBuilder是用来拼接JSON字符串可由第三方开源杰克逊简化。
jsonstr = null字符串;
objectmapper objectmapper =新objectmapper();
jsonstr = objectmapper.writevalueasstring(SC);


4:Ajax从服务器接受参数{ '''文本图书名:totalbooknumber ',' totalmoney}

步:

1):在超级链接中添加点击响应功能,加入购物车并取消默认行为(返回false)

2):加载JSON数据通过HTTP GET请求。美元。getJSON(URL,{资料},{回调})

准备url.agrs,并显示购物车内容在JSP页面内的回调函数。

3):通过在jQuery中隐藏()、显示()方法,判断是否第一次使用购物车,如果是第一次使用,那么JSP页面不会显示购物车。




<脚本类型>文本
src=$ { pageContext。请求。contextpath } /脚本/ jquery-1.7.2 js>

$(函数(){())
无功ishascart =$ { sessionscope。SC = = null };
如果(ishascart = =真){
$(# cartstatus )(隐藏); / /隐藏显示元素
其他{ }
$(# cartstatus )(显示); / /显示、隐藏要素
$(#文本图书名),文本($ { sessionscope。sc.bookname } );
$(# totalbooknumber)。文本($ { sessionscope。sc.totalbooknumber } );
$(# totalmoney)。文本($ { sessionscope。sc.totalmoney } );
}

$()。Click(函数(){)
$(# cartstatus )显示();
var url = this.href; / / URL属性
VaR AGRS = {时间的新的(日期)}; / /时间戳
美元。getJSON(URL,航遥中心,功能(数据){)
$(#文本图书名)。文本(数据。文本图书名);
$(# totalbooknumber)。文本(数据。totalbooknumber);
$(# totalmoney)。文本(数据。totalmoney);
});
返回false;
});
});