手をつないでJSP入門プログラムを作る(九):ショッピングカートの基本実現(サーブレット)
カート類及びカートDAO
ショッピングカート
このクラスもJavaBeanであり、通常のGetterやSetterのほか、単一の書籍の総費用を取得する方法も実現しています.私たちは本の対象をKeyとし、対応する本の数をvalueとするHashMapを利用して買い物中のすべての本を保存します.これにより、カートの中の本とその数を効果的に表すことができます.entiry.Cart.java
カートDAO
操作ロジックの必要な分析を行い、ショッピングカートに選択する本があるか否かを判定し、データを挿入するか更新するかを判定するための .追加ブック 本を削除 ユーザカート を取得する.
ショッピングカートの中で、uidとisbnを通じて本を確定し、誰のショッピングカートなのか、どの本なのかを確定します.本を追加するには、カートに本があるかどうかを判断し、データを更新し、ない場合は記録を挿入する必要があります.
dao.CartDAO.java
商品を追加する
フロントエンドの変更とajaxリクエスト
[Add To Cart]ボタンをクリックすると、ajaxを介してサーバが非同期で要求され、サーバから返されたデータに基づいてプロンプト情報がモデリングボックスで表示されます(成功したかどうか).この機能を満たすためにindexを修正する必要があります.jspコード、前のコードはindex-beforeとして保存する.jsp.
モデリングボックスを追加する以外に、ボタンの変更は非常に重要です.このボタンにはdataで対応するブックのisbnが格納されている.
ボタンクリック時にサーバを非同期で要求するコード.ここでは他のすべてのajax非同期プログラミングと同じです.注意コミットのパスは、
サーブレットは要求出力を処理し、PrintWriterでajaxに返す
ここでは、フロントエンドの非同期要求に対して、
servlet.Cart.java
車の購入を表示
カートの商品はユーザー登録のみで展示されるため、ここでもセッション中のuserを利用してユーザーが登録したか否かを判断し、異なる状態に応じて異なる処理を行う必要がある.HashMapは巡回できないため,ここではまずその中のkey値のSet集合を取り出し,get法を用いてHashMapの巡回を実現する.ここでdelete上のデータに注意し、ajaxで削除を実現する必要があるため、操作を容易にするためにdataでisbnを保存する必要があるとともに、1冊の本を削除した後、総価格を更新する必要があるため、ここでもdataで各本に必要な総費用を保存し、取得して減らせばよい.cart.jsp
商品の削除
ajax実装
サーブレットは要求出力を処理し、PrintWriterでajaxに返す
は、
ショッピングカート
このクラスもJavaBeanであり、通常のGetterやSetterのほか、単一の書籍の総費用を取得する方法も実現しています.私たちは本の対象をKeyとし、対応する本の数をvalueとするHashMapを利用して買い物中のすべての本を保存します.これにより、カートの中の本とその数を効果的に表すことができます.entiry.Cart.java
package entity;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Set;
public class Cart {
// , Map
//
private HashMap books;
public Cart(){}
public HashMap getBooks() {
return books;
}
public void setBooks(HashMap books) {
this.books = books;
}
public double getOneTypeBookCostInCart(Book book){
return book.getPrice()* books.get(book);
}
}
カートDAO
操作ロジックの必要な分析を行い、
UserDAO
には以下の方法が必要であることを知ることができる.ショッピングカートの中で、uidとisbnを通じて本を確定し、誰のショッピングカートなのか、どの本なのかを確定します.本を追加するには、カートに本があるかどうかを判断し、データを更新し、ない場合は記録を挿入する必要があります.
dao.CartDAO.java
package dao;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.HashMap;
import entity.Book;
import entity.Cart;
import util.DBHelper;
public class CartDAO {
//
public String isExist(String uid, String isbn){
Connection conn = null;
PreparedStatement preStmt = null;
ResultSet userSet = null;
System.out.println(" ");
try{
conn = DBHelper.getConnection();
//
String sql = "select * from cart where uid=? and isbn=?";
preStmt = conn.prepareStatement(sql);
preStmt.setString(1, uid);
preStmt.setString(2, isbn);
userSet = preStmt.executeQuery();
if(userSet.next()){
return "true";
}
return "false";
}catch(Exception ex){
ex.printStackTrace();
return "error";
}finally{
if(preStmt != null){
try {
preStmt.close();
preStmt = null;
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
}
//
public boolean addBook(String uid, String isbn, int num){
Connection conn = null;
PreparedStatement preStmt = null;
ResultSet userSet = null;
System.out.println(" ");
try{
conn = DBHelper.getConnection();
//
String exist = isExist(uid, isbn);
if(exist == "error"){
return false;
}if(exist == "false"){
String sql = "insert into cart(uid, isbn, num) values(?, ?, ?)";
preStmt = conn.prepareStatement(sql);
preStmt.setInt(3, num);
}else if(exist == "true"){
String sql = "update cart set num=num+1 where uid=? and isbn=?";
preStmt = conn.prepareStatement(sql);
}
preStmt.setString(1, uid);
preStmt.setString(2, isbn);
int affectedRowNum = preStmt.executeUpdate();
if(affectedRowNum > 0){
return true;
}
else{
return false;
}
}catch(Exception ex){
ex.printStackTrace();
return false;
}finally{
if(preStmt != null){
try {
preStmt.close();
preStmt = null;
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
}
//
public boolean addOneBook(String uid, String isbn){
System.out.println(" ");
return addBook(uid, isbn, 1);
}
//
public boolean deleteBook(String uid, String isbn){
Connection conn = null;
PreparedStatement preStmt = null;
try{
conn = DBHelper.getConnection();
String sql = "delete from cart where uid=? and isbn=?";
preStmt = conn.prepareStatement(sql);
preStmt.setString(1, uid);
preStmt.setString(2, isbn);
int affectedRowNum = preStmt.executeUpdate();
if(affectedRowNum < 1){
return false;
}
return true;
}catch(Exception ex){
ex.printStackTrace();
return false;
}finally{
if(preStmt != null){
try{
preStmt.close();
preStmt = null;
}catch(Exception ex){
ex.printStackTrace();
}
}
}
}
//
public Cart getCart(String uid){
Connection conn = null;
PreparedStatement preStmt = null;
ResultSet bookSet = null;
Cart cart = null;
try{
conn = DBHelper.getConnection();
String sql = "select B.name, B.isbn, B.price, C.num from book B, Cart C where B.isbn = C.isbn and C.uid = ?";
preStmt = conn.prepareStatement(sql);
preStmt.setString(1, uid);
bookSet = preStmt.executeQuery();
HashMap books = new HashMap();
double tolalCost = 0;
while(bookSet.next()){
Book book = new Book();
book.setName(bookSet.getString("name"));
book.setIsbn(bookSet.getString("isbn"));
float price = bookSet.getFloat("price");
book.setPrice(price);
int num = Integer.parseInt(bookSet.getString("num"));
books.put(book, num);
tolalCost += price * num;
}
cart = new Cart();
cart.setBooks(books);
cart.setTotalCost(tolalCost);
return cart;
}catch(Exception ex){
ex.printStackTrace();
return null;
}finally{
if(bookSet != null){
try{
bookSet.close();
bookSet = null;
}catch(Exception ex){
ex.printStackTrace();
}
}
if(preStmt != null){
try{
preStmt.close();
preStmt = null;
}catch(Exception ex){
ex.printStackTrace();
}
}
}
}
}
商品を追加する
フロントエンドの変更とajaxリクエスト
[Add To Cart]ボタンをクリックすると、ajaxを介してサーバが非同期で要求され、サーバから返されたデータに基づいてプロンプト情報がモデリングボックスで表示されます(成功したかどうか).この機能を満たすためにindexを修正する必要があります.jspコード、前のコードはindex-beforeとして保存する.jsp.
"java" import="java.util.*" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
"entity.Book" %>
"dao.BookDAO" %>
"header.jsp" %>
<div class="main">
<div class="modal fade" id="addAlert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×button>
<h4 class="modal-title" id="myModalLabel"> h4>
div>
<div class="modal-body" id="addAlert-content"> div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"> button>
div>
div>
div>
div>
<div class="container-fluid">
<div class="row">
new BookDAO();
ArrayList books = bookDao.getAllBooks();
if(books != null && books.size() > 0){
for(Book book:books){
%>
<div class="book-box col-md-3 col-sm-6">
<div class="book">
<a href="single.jsp?isbn="><img src="img/"/>a>
<p class="book-name">《》p>
<p class="book-intro">p>
<div class="add-button">
<span class="cost">¥span> / <span class="cost-original">¥span>
<button class="add-btn" data-book-isbn="">Add To Cartbutton>
div>
div>
div>
div>
div>
div>
"footer.jsp" %>
モデリングボックスを追加する以外に、ボタンの変更は非常に重要です.このボタンにはdataで対応するブックのisbnが格納されている.
<button class="add-btn" data-book-isbn="">Add To Cart</button>
ボタンクリック時にサーバを非同期で要求するコード.ここでは他のすべてのajax非同期プログラミングと同じです.注意コミットのパスは、
/SimpleShop/cart
です.私たちがコミットしたデータには、isbnと操作タイプのactionの2つのフィールドが含まれています.ここではuidをコミットし、uidはsessionで取得できます..modal
はbootstrapフレームモードボックスの方法であり、ここではidがaddAlertであるモードボックスを表示する.このとき考えるべきことは、バックグラウンドがどのようにデータを返すのかということです.//
$(".add-btn").click(function(){
var isbn = $(this).data("book-isbn");
$.ajax({
url: "/SimpleShop/cart",
type: "GET",
dataType:"json",
data: {
isbn: isbn,
action: "add"
},
success: function(result){
$('#addAlert-content').text(result.message);
$('#addAlert').modal('show');
},
error: function(result){
$('#addAlert-content').text(result.message);
$('#addAlert').modal('show');
}
});
});
サーブレットは要求出力を処理し、PrintWriterでajaxに返す
ここでは、フロントエンドの非同期要求に対して、
PrintWriter
を介してストリームを介してデータを返すだけでよい.コードセグメントのフォーマットは次のとおりです.printの内容はjsonの形式で返され、フロントエンドにオブジェクトタイプが返されます.一度に1冊の本を追加するため、CartDAO
のaddOneBook
メソッドを呼び出すだけで、削除にはdeleteBook
メソッドを呼び出すだけでよい.CartDAO
が封入されていて、その後コードを書くのが便利になったのではないでしょうか.//
response.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
if(user == null){
//
// json
out.print("{\"err\":\"error\",\"message\":\" \"}");
out.flush();
out.close();
return;
}
servlet.Cart.java
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import dao.CartDAO;
import entity.User;
/**
* Servlet implementation class Cart
*/
@WebServlet("/cart")
public class Cart extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public Cart() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
User user = (User)request.getSession().getAttribute("user");
//
response.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
if(user == null){
//
out.print("{\"err\":\"error\",\"message\":\" \"}");
out.flush();
out.close();
return;
}
String isbn = request.getParameter("isbn");
String action = request.getParameter("action");
String uid = user.getUid();
if(action.equals("add")){
CartDAO cartdao = new CartDAO();
if(cartdao.addOneBook(uid, isbn)){
out.print("{\"message\":\" \"}");
}else{
out.print("{\"message\":\" \"}");
}
}else if(action.equals("delete")){
CartDAO cartdao = new CartDAO();
if(cartdao.deleteBook(uid, isbn)){
out.print("{\"err\":\"success\",\"message\":\" \"}");
}else{
out.print("{\"err\":\"fail\",\"message\":\" \"}");
}
}
out.flush();
out.close();
//
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
車の購入を表示
カートの商品はユーザー登録のみで展示されるため、ここでもセッション中のuserを利用してユーザーが登録したか否かを判断し、異なる状態に応じて異なる処理を行う必要がある.HashMapは巡回できないため,ここではまずその中のkey値のSet集合を取り出し,get法を用いてHashMapの巡回を実現する.ここでdelete上のデータに注意し、ajaxで削除を実現する必要があるため、操作を容易にするためにdataでisbnを保存する必要があるとともに、1冊の本を削除した後、総価格を更新する必要があるため、ここでもdataで各本に必要な総費用を保存し、取得して減らせばよい.cart.jsp
"java" import="java.util.*" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
"dao.CartDAO" %>
"entity.*" %>
"header.jsp" %>
<div class="main main-white">
<div class="modal fade" id="deleteAlert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×button>
<h4 class="modal-title" id="myModalLabel"> h4>
div>
<div class="modal-body" id="deleteAlert-content"> div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"> button>
div>
div>
div>
div>
<div class="container-fluid">
<div class="row">
<div class="col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
"user");
if(user == null){
//
%>
<div class="withoutlogin-area">
<p> , p>
div>
else{
%>
<div class="table-responsive table-shadow">
<table class="table table-striped">
<thead>
<tr>
<th>th>
<th> th>
<th> ( )th>
<th> th>
<th> th>
<th> th>
tr>
thead>
<tbody>
String uid = user.getUid();
CartDAO cartdao = new CartDAO();
Cart cart = cartdao.getCart(uid);
HashMap books = cart.getBooks();
Set bookSet = books.keySet();
Iterator it = bookSet.iterator();
double totalPrice = 0;
while(it.hasNext())
{
Book book = it.next();
double cost = cart.getOneTypeBookCostInCart(book);
totalPrice += cost;
%>
<tr>
<td><input type="checkbox" />td>
<td>《》td>
<td>String.format("%.2f",book.getPrice()) %>td>
<td>get(book) %>td>
<td>String.format("%.2f",cost)%>td>
<td><a href="javascript:void(0)" class="delete" data-cost="" data-book-isbn=""> a>td>
tr>
tbody>
table>
div>
<div class="divider divider-light">div>
<div class="amount">
<div class="tag-left">
<input class="allchose" type="checkbox" />
div>
<div class="tag-right">
:¥<span class="amount-cost">String.format("%.2f",totalPrice) %>span><button type="submit" class="btn"> button>
div>
div>
div>
div>
div>
div>
"footer.jsp" %>
商品の削除
ajax実装
$(".delete").click(function(){
var isbn = $(this).data("book-isbn");
var cost = $(this).data("cost");
var $tr = $(this).closest("tr");
$.ajax({
url: "/SimpleShop/cart",
type: "GET",
dataType:"json",
data: {
isbn: isbn,
action: "delete"
},
success: function(result){
$('#deleteAlert-content').text(result.message);
$('#deleteAlert').modal('show');
if(result.err == "success"){
$tr.fadeOut();
$(".amount-cost").text(($(".amount-cost").text() - cost).toFixed(2));
}
},
error: function(result){
$('#deleteAlert-content').text(result.message);
$('#deleteAlert').modal('show');
}
});
});
サーブレットは要求出力を処理し、PrintWriterでajaxに返す
は、
CartDAO
のdeleteBook
メソッドを呼び出すだけでよい.具体的には上記の商品を参照してください.