###Jsp+Servlet购物商城day02.1: 页面加载完,导航栏显示分类信息。(在公共页面head.jsp)

来源:互联网 发布:能找主奴的软件 编辑:程序博客网 时间:2024/06/05 06:02

导航栏显示分类信息:

功能入口:页面加载完毕head.jsp发送Ajax请求;

处理过程:CategoryServlet;===无非是查询所有分类而已。很简单。关键是页面Ajax。

功能出口:head.jsp显示Ajax请求返回的Json数据。

===DOM操作,js遍历便利所有分类,获取DOM对象;给DOM对象 append子元素,并给子元素复制为当前遍历的 分类值。


功能入口:页面加载完毕head.jsp发送Ajax请求;

功能出口:head.jsp显示Ajax请求返回的Json数据。

===DOM操作,js遍历便利所有分类,获取DOM对象;给DOM对象 append子元素,并给子元素复制为当前遍历的 分类值。

都在一个页面。head.jsp代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%>    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><script type="text/javascript">//===页面加载完成,触发一个函数 $(function(){$.post("${pageContext.request.contextPath}/CategoryServlet",//请求路径{"method":"findAll"},//提交的数据function(v){//alert(v);//将数据设置进导航条 //<li><a href="#">电脑办公</a></li>for(var i = 0; i < v.length; i++){var cat = v[i];//{"cid":xxx,"cname":"yyyy"}$("#showCat").append("<li><a href='${pageContext.request.contextPath}/ProductServlet?method=findByCid&cid=" + cat.cid + "'>" + cat.cname + "</a></li>");}},//回调函数"json"//数据类型);}); /* $(function(){alert("---");$.post("${pagecontext.request.contextPath}/CategoryServlet",{"method":"findAll"},function(v){alert(v);});}); */</script><!--         描述:菜单栏         --><div class="container-fluid"><div class="col-md-4"><img src="img/logo2.png" /></div><div class="col-md-5"><img src="${pageContext.request.contextPath}/img/header.png" /></div><div class="col-md-3" style="padding-top:20px"><ol class="list-inline"><c:if test="${empty user }"><li><a href="${pageContext.request.contextPath}/login.jsp">登录</a></li><li><a href="${pageContext.request.contextPath}/register.jsp">注册</a></li></c:if><c:if test="${not empty user }"><li>欢迎您:${user.username }</li><li><a href="${pageContext.request.contextPath}/UserServlet?method=logout">登出</a></li></c:if><li><a href="${pageContext.request.contextPath}/cart.jsp">购物车</a></li></ol></div></div><!--         描述:导航条         --><div class="container-fluid"><nav class="navbar navbar-inverse"><div class="container-fluid"><!-- Brand and toggle get grouped for better mobile display --><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#">首页</a></div><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul id="showCat" class="nav navbar-nav"></ul><form class="navbar-form navbar-right" role="search"><div class="form-group"><input type="text" class="form-control" placeholder="Search"></div><button type="submit" class="btn btn-default">Submit</button></form></div><!-- /.navbar-collapse --></div><!-- /.container-fluid --></nav></div>


处理过程:CategoryServlet;无非是查询所有分类而已。很简单。关键是页面Ajax。

这里提一下:因为使用了前面刚学过的Redis。Redis可以只存在内存,不存在磁盘。所以应用之一就是作为程序缓存,提高程序运行效率。

代码如下:

package cn.itcast.servlet;import java.io.IOException;import java.sql.SQLException;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import cn.itcast.service.CategoryService;import cn.itcast.service.impl.CategoryServiceImpl;public class CategoryServlet extends BaseServlet {private static final long serialVersionUID = 1L;/*public String findAll(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {return null;}*//*===这里是Ajax请求的方法,页面只是局部刷新。不需要页面跳转,只是响应一个Json格式字符串。所以返回值是void*/public void findAll(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {CategoryService service = new CategoryServiceImpl();String findAll = null;//System.out.println(findAll);try {findAll = service.findAll();//System.out.println(findAll);} catch (SQLException e) {// TODO Auto-generated catch blocke.printStackTrace();}response.setCharacterEncoding("utf-8");response.getWriter().write(findAll);}}
CategoryService:

package cn.itcast.service.impl;import java.sql.SQLException;import java.util.List;import cn.itcast.domain.Category;import cn.itcast.dao.CategoryDao;import cn.itcast.dao.impl.CategoryDaoImpl;import cn.itcast.service.CategoryService;import cn.itcast.utils.JedisUtils;import net.sf.json.JSONArray;import redis.clients.jedis.Jedis;public class CategoryServiceImpl implements CategoryService {@Overridepublic String findAll() throws SQLException {//====v1//获取所有分类信息List<Category>CategoryDao dao = new CategoryDaoImpl();List<Category> list = dao.findAll();System.out.println(list);// 将List转为Json格式字符串。String json = JSONArray.fromObject(list).toString();/*//====v2==高效。(不便于测试)Jedis j = JedisUtils.getJedis();String json = j.get("CategoryJson");try {====Redis里的值,刷新8次,取不到了。(已测)===?===又没这个问题了。===可能是频繁切换 Redis的开启和关闭导致的。==###=很可能是Redis对象没有关闭流(close())。====会用就行。if (json==null) {//===第一次取值//获取所有分类信息List<Category>CategoryDao dao = new CategoryDaoImpl();List<Category> list = dao.findAll();System.out.println(list);// 将List转为Json格式字符串。json = JSONArray.fromObject(list).toString();j.set("CategoryJson", json);}} catch (Exception e) {throw new RuntimeException("Redis出错");}finally {JedisUtils.close(j);//===和数据流一样。}*/return json;}}






阅读全文
0 0
原创粉丝点击