终极完美《简易商城购物车系统》揭秘-java简易购物车系统

《简易商城购物系统》

大家经常去网上够物，对网上所谓的购物车应该不会陌生吧，那么今天我们就用使用javaweb的MVC设计模式来实现一个网上购物系统的案例。

最终效果如下：

三层架构的简单介绍

一、开发步骤

首先要搞清楚你要做什么，然后：

1.搭建开发环境

jstl.jar

standard.jar

2.建立类包

3.建立数据库

使用内存数据库

总之，此购物车的实现，使用的是MVC设计模式，MVC设计模式的思路就是从jsp--javabean—servlet--jsp页面做显示

流程图：

图一：MVC设计模式的简介

图二：购物系统案例的实现思路：

图三：设计购物车页面

节日正式开始，精彩不容错过。。。。

#p#

1.写一个jsp购物页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
<%  
    String path = request.getContextPath();  
    String basePath = request.getScheme() + "://" 
            + request.getServerName() + ":" + request.getServerPort()  
            + path + "/";  
%>  
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>   
      
    <title>飘叶网上商城</title>  
    <meta http-equiv="pragma" content="no-cache">  
    <meta http-equiv="cache-control" content="no-cache">  
    <meta http-equiv="expires" content="0">      
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
    <meta http-equiv="description" content="This is my page">  
    <!--  
    <link rel="stylesheet" type="text/css" href="styles.css">  
    -->  
  </head>  
  <body>  
  <hr/>  
  <h2 >欢迎进入飘叶网上购物商城</h2>  
  <hr>  
       <a href="${pageContext.request.contextPath}/ListBookServlet">进入购物页面</a> <br>  
  </body>  
</html>

2.写一个javabean

package cn.itcast.cart.domain;  
public class Book  
{  
    private String id;  
    private String name;//书名  
    private String author;//作者  
    private int price;  
      
    public Book()  
    {  
        super();  
        // TODO Auto-generated constructor stub  
    }  
    public Book(String id, String name, String author, int price)  
    {  
        super();  
        this.id = id;  
        this.name = name;  
        this.author = author;  
        this.price = price;  
    }  
    public String getId()  
    {  
        return id;  
    }  
    public void setId(String id)  
    {  
        this.id = id;  
    }  
    public String getName()  
    {  
        return name;  
    }  
    public void setName(String name)  
    {  
        this.name = name;  
    }  
    public String getAuthor()  
    {  
        return author;  
    }  
    public void setAuthor(String author)  
    {  
        this.author = author;  
    }  
    public int getPrice()  
    {  
        return price;  
    }  
    public void setPrice(int price)  
    {  
        this.price = price;  
    }  
      
}

3.建立DB，用Map集合来模拟数据库

package cn.itcast.cart.domain;  
import java.util.Collection;  
import java.util.LinkedHashMap;  
import java.util.Map;  
public class DB  
{  
//    使用map集合来模拟数据库  
    private static Map<String , Book> books=new LinkedHashMap<String, Book>();  
    static{  
        books.put("1", new Book("1", "《水浒传》", "施耐庵", 48));  
        books.put("2", new Book("2", "《西游记》", "吴承恩 ", 58));  
        books.put("3", new Book("3", "《三国演义》", "罗贯中", 78));  
        books.put("4", new Book("4", "《红楼梦》", "曹雪芹", 28));  
        books.put("5", new Book("5", "《平凡的世界》", "路遥", 18));  
    }  
//    获得所有图书  
    // 获得所有图书  
    public static Collection<Book> getAll() {  
        return books.values();  
    }  
    // 根据id查找图书  
    public static Book find(String id) {  
        return books.get(id);  
    }  
}

4.用javabean建立一个购物车对象

package cn.itcast.cart.domain;  
public class ShoppingcartItem  
{  
    //购物车项，每一本书买了多少本，总共多少钱  
    private Book book;  
    private int quantity;  
    private int price;  
    public Book getBook()  
    {  
        return book;  
    }  
    public void setBook(Book book)  
    {  
        this.book = book;  
    }  
    public int getQuantity()  
    {  
        return quantity;  
    }  
    public void setQuantity(int quantity)  
    {  
        this.quantity = quantity;  
        this.price=this.book.getPrice()*quantity;  
    }  
    public int getPrice()  
    {  
        return price;  
    }  
    public void setPrice(int price)  
    {  
        this.price = price;  
    }  
}

购物车—cart

package cn.itcast.cart.domain;  
import java.util.HashMap;  
import java.util.Map;  
//购物车对象  
public class Shoppingcart  
{  
    private Map<String, ShoppingcartItem> items=new HashMap<String, ShoppingcartItem>();  
    private int price;//总价  
    public Map<String, ShoppingcartItem> getItems()  
    {  
        return items;  
    }  
    public void setItems(Map<String, ShoppingcartItem> items)  
    {  
        this.items = items;  
    }  
    public int getPrice()  
    {  
        //计算总价  
        int price=0;  
        for(ShoppingcartItem item:items.values())  
        {  
            price+=item.getPrice();  
        }  
        return price;  
    }  
    public void setPrice(int price)  
    {  
        this.price = price;  
    }  
}

5、获得图书商品列表的servlet—ListBookServlet.java

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import java.util.Collection;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import cn.itcast.cart.domain.Book;  
import cn.itcast.cart.domain.DB;  
 
public class ListBookServlet extends HttpServlet  
{  
    //从DB中查询所有的图书  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        //查询所有的商品  
        Collection<Book> books = DB.getAll();  
//        转发给jsp显示  
        request.setAttribute("books", books);  
        request.getRequestDispatcher("/WEB-INF/pages/listbook.jsp").forward(request, response);  
    }  
 
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
 
}

6.servlet处理完的数据转发到一个展示商品的页面—listbook.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>显示所有的商品</title> 
<script type="text/javascript"> 
    function buy(id){  
        window.location = "${pageContext.request.contextPath}/BuyServlet?id="+id;  
    }  
</script> 
 
</head> 
<body style="text-align: center"> 
    <h1 >商品列表</h1> 
    <table border="1"  width="400px"> 
        <tr> 
            <td>图书名称</td> 
            <td>作者</td> 
            <td>价格</td> 
            <td>购买</td> 
        </tr> 
        <c:forEach var="book" items="${requestScope.books}"> 
            <tr> 
            <td>${book.name}</td> 
            <td>${book.author}</td> 
            <td>${book.price}</td> 
            <td> 
                <input type="button" value="购买" onclick="buy(${book.id})"/> 
            </td> 
        </tr> 
        </c:forEach> 
    </table> 
</body> 
</html>

7.写一个购买处理的servlet

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import java.util.Map;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import cn.itcast.cart.domain.Book;  
import cn.itcast.cart.domain.DB;  
import cn.itcast.cart.domain.Shoppingcart;  
import cn.itcast.cart.domain.ShoppingcartItem;  
public class BuyServlet extends HttpServlet  
{  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        //购买页面  
        //获得图书  
        String id=request.getParameter("id");  
        Book book=DB.find(id);  
//        获得购物车  
        Shoppingcart cart = (Shoppingcart) request.getSession().getAttribute("cart");  
        if(cart==null){  
            //首次购物  
            cart=new Shoppingcart();  
            request.getSession().setAttribute("cart", cart);  
        }  
//        商品放入购物车  
        bookInCart(book,cart);  
//        跳转至购物车页面,是一个请求重定向的页面  
        response.sendRedirect(request.getContextPath()+"/ListCartServlet");  
    }  
//购物  
    private void bookInCart(Book book, Shoppingcart cart)  
    {//判断是否买过  
        Map<String, ShoppingcartItem> items = cart.getItems();       
        ShoppingcartItem item = items.get(book.getId());      
        if(item==null){  
            //此书未买过，创建新条目  
            item=new ShoppingcartItem();  
            item.setBook(book);  
            item.setQuantity(1);  
            //条目存入购物车  
            items.put(book.getId(), item);  
        }else{  
            //买过数量加1  
            item.setQuantity(item.getQuantity()+1);  
        }  
          
    }  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
 
}

#p#

8.写一个获得购物车数据处理的servlet—ListCartServlet.java

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
public class ListCartServlet extends HttpServlet  
{     
    //查看购物车，请求重定向的页面  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        request.getRequestDispatcher("/WEB-INF/pages/listcart.jsp").forward(request, response);  
      
    }  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
}

9.购买的东西放入购物车，继而转向购物车展示页面—listcart.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" 
    pageEncoding="UTF-8"%> 
    <%--    只要使用foreach就要导入下面的这句代码--%> 
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>购物车页面</title> 
<script type="text/javascript"> 
    function change(id,inputObj){  
        var quantity=inputObj.value;  
 
        if(quantity==null || quantity=="") {  
            alert("数量不能为空");  
            inputObj.value = defaultValue;  
            return;  
        }  
          
        if(quantity.match(/^[1-9][0-9]*$/)==null) {  
            alert("数量必须为正整数");  
            inputObj.value = defaultValue;  
            return;  
        }  
          
        if(parseInt(quantity)>999) {  
            alert("您购买的数量已达到团购标准，请致电800-820-8820");  
            inputObj.value = defaultValue;  
            return;  
        }  
              window.location="${pageContext.request.contextPath}/UpdateServlet?id="+id+"&quantity="+quantity;  
    }  
</script> 
 
</head> 
<body style="text-align: center"> 
<h1>我的购物车</h1><br> 
<hr> 
<table border="1" width="800px"> 
    <tr> 
        <td>商品名称</td> 
        <td>单价</td> 
        <td>数量</td> 
        <td>小计</td> 
        <td>操作</td> 
    </tr> 
<%--map迭代完后都是entry--%> 
    <c:forEach var="entry" items="${cart.items}"> 
    <tr> 
        <td>${entry.value.book.name}</td> 
        <td>${entry.value.book.price}</td> 
        <td> 
            <input type="text" value="${entry.value.quantity}"  onblur="change(${entry.key},this) " style="width: 40px;"/> 
        </td> 
        <td>${entry.value.price}</td> 
        <td> 
            <a href="${pageContext.request.contextPath}/DaleServlet?id=${entry.key }">删除</a> 
        </td> 
    </tr>      
    </c:forEach> 
    <tr> 
        <td> 
            <a href="${pageContext.request.contextPath}/clearServlet">清空购物车</a> 
        </td> 
        <td> 
            <a href="${pageContext.request.contextPath}/ListBookServlet">继续购物</a> 
        </td> 
        <td> 
            <a href="#">下订单</a> 
        </td> 
        <td colspan="2">购物车总价：￥${cart.price}元</td> 
    </tr> 
</table> 
</body> 
</html>

下面就是实现购物车里面的一些操作功能

10.更新购物车，就是修改完数量后，自动更新购物车—UpdateServlet.java

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import java.util.Map;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import cn.itcast.cart.domain.Shoppingcart;  
import cn.itcast.cart.domain.ShoppingcartItem;  
public class UpdateServlet extends HttpServlet  
{  
    //更新购物车  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        //获得id和quantity  
        String id=request.getParameter("id");  
        int quantity=Integer.parseInt(request.getParameter("quantity"));  
        //获得购物车  
        Shoppingcart cart = (Shoppingcart) request.getSession().getAttribute("cart");  
        // 修改数量  
        /*  
        Map<String, ShoppingcartItem> items = cart.getItems();  
          
        ShoppingcartItem item = items.get(id);  
          
        item.setQuantity(quantity);*/ 
          
        cart.getItems().get(id).setQuantity(quantity);  
          
        // 跳转至购物车页面  
        response.sendRedirect(request.getContextPath() + "/ListCartServlet");  
    }  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
 
}

11.删除购物车中的单行数据—DaleServlet.java

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import cn.itcast.cart.domain.Shoppingcart;  
public class DaleServlet extends HttpServlet  
{  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        // 获得id  
        String id = request.getParameter("id");       
        // 获得购物车  
        Shoppingcart cart = (Shoppingcart) request.getSession().getAttribute("cart");          
        //删除条目  
        cart.getItems().remove(id);  
 
        // 跳转至购物车页面  
        response.sendRedirect(request.getContextPath()+"/ListCartServlet");  
    }  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
 
}

12.清空购物车—clearServlet.java

package cn.itcast.cart.web.servlet;  
import java.io.IOException;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import cn.itcast.cart.domain.Shoppingcart;  
public class clearServlet extends HttpServlet  
{  
    public void doGet(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        // 获得购物车  
        Shoppingcart cart = (Shoppingcart) request.getSession().getAttribute("cart");  
          
        // 清空购物车  
        cart.getItems().clear();  
          
        // 跳转至购买页面  
        response.sendRedirect(request.getContextPath()+"/ListBookServlet");  
    }  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException  
    {  
        doGet(request, response);  
    }  
 
}

ok,忙碌到半夜，到此结束，下面看看我们的最终效果吧：

嘿嘿，没有美工处理的页面，还行，像那回事吧？

这上面的所有功能都可以实现的哦！

原文链接：http://www.cnblogs.com/yejiurui/archive/2012/10/06/2713464.html

【编辑推荐】