从servlet发出ajax请求

时间:2017-06-29 19:52:30

标签: jquery ajax jsp

我想从jsp向控制器发送ajax请求,并等待产品的详细信息(价格,名称,描述)为json。当按下屏幕上的“获取产品详细信息”按钮时,这些详细信息将显示在对话框中。  控制器:

 @WebServlet(name = "shop", urlPatterns = "/shop")
    public class AddToController extends HttpServlet {

        static final Logger logger = LoggerFactory.getLogger(AddToController.class);
        private static final long serialVersionUID = 1L;
        private static final String KEY_CART = "cart";
        private final Map<Integer, Product> products;

        public AddToController() {
            Product c1 = new Product(1, "Product1", 149900f, "http://placehold.it/150x50", "description");
            Product c2 = new Product(2, "Product2", 149900f, "http://placehold.it/150x50", "description2");
            Product c3 = new Product(3, "Product3", 149900f, "http://placehold.it/150x50", "description3");
            products = new HashMap<>();
            products.put(11, c1);
            products.put(12, c2);
            products.put(13, c3);

            Product val=products.get(11);
            System.out.println("the value is:" + val);
            Product val2=products.get(12);
            System.out.println("the value is:" + val2);
            Product val3=products.get(12);
            System.out.println("the value is:" + val3);
        }


        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        logger.info("DO getAddToController METHOD");

            String action = req.getParameter("action");

            switch (action) {
            case "addToCart":
                this.doPost(req, resp);
                break;
            case "viewCart":
                this.viewCart(req, resp);
                break;
            case "empty":
                this.empty(req, resp);
                break;
            case "browse":
            default:
                this.browse(req, resp);
            }


        }

        @SuppressWarnings("unchecked")
        protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
            logger.info("DO postAddToController METHOD");
            Integer productId = Integer.parseInt(req.getParameter("productId"));

            HttpSession session = req.getSession();
            if (session.getAttribute(KEY_CART) == null) {
                session.setAttribute(KEY_CART, new HashMap<Product, Integer>());
            }

            Map<Product, Integer> cart = (Map<Product, Integer>) session.getAttribute(KEY_CART);

            if (cart.containsKey(products.get(productId))) {
                cart.put(products.get(productId), cart.get(products.get(productId)) + 1);
            } else
                cart.put(products.get(productId), 1);

            resp.sendRedirect("shop?action=viewCart");

        }

JSP:

<html lang="en">    
<body>
    <c:forEach items="${requestScope.products}" var="product">
    <c:url value="/shop" var="shopUrl">
        <c:param name="action" value="addToCart"/>
        <c:param name="productId" value="${product.key}"/>
    </c:url>
    <form method="POST" action="addToCart">
        <div id="products">
            <a href="${shopUrl}">${product.value.name}</a>
            <span>${product.value.id}</span>
            <span>${product.value.image}</span>
            <span>${product.value.price}</span>
            <span>${product.value.description}</span>
            <input class="btnAjax" name="btnAjax" type="button" value="Get Products Details" onclick="getProducts(requestScope.products.id)"/>          
        </div>
        <br/>
    </form>
</c:forEach>
<div class="form-group">
    <div class="col-sm-9 col-sm-offset-4">
        <a href="<c:url value="/" />">Logout</a>
    </div>
</div>

</body>


<script src="js/jquery-1.9.0.js" type="text/javascript"></script>
<script>
$(document).ready(function(){

function getDetails(id) {
    $.ajax({
        url: "/shop/GetProducts",
        contentType: 'application/json; charset=utf-8',
        type: "GET",
        data:' { id:"'  + id + '" }',
        dataType: "json",
        success: function (response) {
        $('#products').json(response);  })
        }
    });
}

0 个答案:

没有答案