JavaWeb旅游项目4
旅游线路的分页展示和旅游线路的查询
1.点击了不同的分类导航后，将来看到的旅游线路不一样的。通过分析数据库表结构，发现，旅游线路表
(tab_route)和分类表(tab_category)是一个多对一的关系
2.查询不同分类的旅游线路sql
select * from tab_route where cid ?;
那么这个?的值就是tab_category表中的cid的值。
3.当我们点击了分类导航按钮，调到响应的旅游线路页面，那么需要把这个cid的值带过去
修改header.html中的代码在跳转路径上拼接上cid
1.把cid拼接上： listStr+ '<li><a href "route_list.html?cid '+ele.cid+'">'+ ele.cname+'</a></li>'
代码如下
//获取分类数据
$.get("category/findAll",{},function (respData) {
//[{"cid":8,"cname":"全球自由行"},{"cid":5,"cname":"国内游"}....]
// <li><a href="route_list.html">门票</a></li>
var liStr=' <li class="nav-active"><a href="index.html">首页</a></li>';
//BIANLISHUZU
for(var i=0;i<respData.length;i++){
// alert(respData[i].cname);
// var cname=respData[i].cname;
// var cid = respData[i].cid;
var li = '<li><a href="route_list.html">'+respData[i].cname+'</a></li>';
liStr += li;
// alert(liStr)
}
liStr += '<li><a href="favoriterank.html">收藏排行榜</a></li>';
//alert(liStr)
//jiang listr shezhidaozhegelimian
$("#myUi").html(liStr)
});
首先编写RouteServlet
1.获取三个请求参数 currentPage pageSize cid
2.处理请求参数，把字符串的转换成数字的，并给一些默认值。
3.调用service返回PageBean对象
4.把PageBean对象转换成JSON响应回去。
public void pageQuery(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1.获取请求参数currentPage pageSize cid
String currentPageStr = request.getParameter("currentPage");
String pageSizeStr = request.getParameter("pageSize");
String cidStr = request.getParameter("cid");
String rname = request.getParameter("rname");
//2.处理请求参数
int currentPage = 0;
if (currentPageStr != null && currentPageStr.length() > 0) {
currentPage = Integer.parseInt(currentPageStr);
} else {
currentPage = 1;
}
int pageSize = 0;//每页的条数。
if (pageSizeStr != null && pageSizeStr.length() > 0) {
pageSize = Integer.parseInt(pageSizeStr);
} else {
pageSize = 5;//如果不传递的默认值
}
int cid = 5;
if (cidStr != null && cidStr.length() > 0 && !cidStr.equals("undefined")) {
cid = Integer.parseInt(cidStr);
}
//3.调用service
RouteService routeService = new RouteServiceImpl();
PageBean_new<Route> PageBean = routeService.queryRoutePageBean(currentPage, pageSize, cid, rname);
//吧pagebean响应回去
writeValue(PageBean, response);
}
@Override
//根据rid查询
public Route findOneByRid(String rid) {
//根据id去route表中查询route对象
Route route = routeDao.findOneByRid(Integer.parseInt(rid));
//根据route的id查询图片信息集合
List<RouteImg> routeImgList = routeImgDao.findImags(route.getRid());
//将集合设置到route对象
route.setRouteImgList(routeImgList);
//根据route sid查询卖家信息商家id查询商家信息
Seller seller = sellerDao.findSellerBySid(route.getSid());
route.setSeller(seller);
//CHAXUNSHOUCANGCISHU
int count = favoriteDao.findCountByRid(route.getRid());
route.setCount(count);
return route;
}
//根据id查询一个旅游线路的详细信息。
public void findOne(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1.获取前台提交上来的rid
String rid = request.getParameter("rid");
// int rid = 1;
// if (ridStr != null && ridStr.length() > 0 && !ridStr.equals("undefined")) {
// rid = Integer.parseInt(ridStr);
// }
//2.调用service
RouteService routeService = new RouteServiceImpl();
Route route = routeService.findOneByRid(rid);
//转为json返回
writeValue(route, response);
RouteService
PageBean_new<Route> queryRoutePageBean(int currentPage, int pageSize, int cid,String rname);
Route findOneByRid(String rid);
RouteServiceImpl
private RouteDao routeDao = new RouteDaoImpl();
@Override
public PageBean_new<Route> queryRoutePageBean(int currentPage, int pageSize, int cid,String rname) {
//设置总条数
int totalItem = routeDao.getTotalItem(cid,rname);
//创建pagebean
PageBean_new<Route> pageBean = new PageBean_new<>(totalItem, currentPage, pageSize);
//起始索引=(当前页码-1)*每页的条数
int startIndex = (currentPage - 1) * pageSize;
List<Route> list = routeDao.queryLimitList(cid, startIndex, pageSize,rname);
pageBean.setList(list);
//设置总页数
return pageBean;
}
RoutDao
public int getTotalItem(Integer cid,String rname);
public List<Route> queryLimitList(int cid, int start, int pageSize,String rname);
public Route findOneByRid(int rid);
RouteDaoImpl
//根据旅游线路的id查询出，这个线路的总条数
@Override
public int getTotalItem(Integer cid,String rname) {
// String sql = "select count(*) from tab_route where cid=? ";
// Integer count = jdbcTemplate.queryForObject(sql, Integer.class, cid);
//1.定义一个sql模板
String sql = "select count(*) from tab_route where 1=1 ";
//2.判断参数是否有值，进行sql的动态拼接
//采用缓冲流的方式进行拼接
StringBuffer sb = new StringBuffer(sql);
//创建集合放参数的值
ArrayList<Object> list = new ArrayList<>();
if(cid!=0){
sb.append(" and cid=? ");
//将cid的值放进去
list.add(cid);
}
if(rname!=null&&rname.length() > 0){
//根据rname进行模糊查询
sb.append(" and rname like ? ");
list.add("%" + rname + "%");
}
//取出拼接好的sql语句
sql=sb.toString();
Integer count = jdbcTemplate.queryForObject(sql, Integer.class, list.toArray());
return count;
}
/**
* @param cid 线路id
* @param start 分页的起始索引 limit 0 10
* @param pageSize 每页的条数
* @return
*/
@Override
public List<Route> queryLimitList(int cid, int start, int pageSize,String rname) {
// String sql = "select * from tab_route where cid = ? limit ? , ?";
// List<Route> routeList = jdbcTemplate.query(sql, new BeanPropertyRowMapper<Route>(Route.class), cid, start, pageSize);
//
System.out.println(rname+"值");
//1.定义sql模板
String sql = "select * from tab_route where 1=1 ";
//2.创建参数是否有值，进行sql的动态拼接
//为了拼接创建sb ,将sql传进去
StringBuffer sb = new StringBuffer(sql);
//创建集合放参数的值
ArrayList<Object> list = new ArrayList<>();
if(cid != 0){
sb.append(" and cid=? ");
list.add(cid);
}
if(rname !=null && rname.length()>0){
//根据rname进行模糊查询
sb.append(" and rname like ? ");
list.add("%" + rname + "%");
}
//分页拼接
sb.append(" limit ?,? ");
//取出拼接好的sql语句
sql = sb.toString();
//吧分页的参数的值加进去
list.add(start);
list.add(pageSize);
List<Route> routeList = jdbcTemplate.query(sql, new BeanPropertyRowMapper<Route>(Route.class), list.toArray());
return routeList;
}
@Override
public Route findOneByRid(int rid) {
System.out.println(rid);
System.out.println("调用了");
String sql = "select * from tab_route where rid=?";
Route route = jdbcTemplate.queryForObject(sql, new BeanPropertyRowMapper<Route>(Route.class), rid);
return route;
}
Route_list.html
<script type="text/javascript" src="js/getUrlParam.js"></script>
<script>
// var v=location.search;
// alert(v);
//获取分类按钮带过来的cid的值
var cid= UrlParam.param("cid");
//.获取rname
var rname = UrlParam.param("rname");
// alert(rname);
//发送ajax请求分页数据
function to_page(cid,pageNumber,rname){
$.get("route/pageQuery",{'cid':cid,'currentPage':pageNumber,'rname':rname},function(pb){
//解析Rout的信息展示，抽取个方法把后台响应的结果传递过去
parseRoutInfo(pb);
//解析分页数据，抽取个方法
parseLimitInfo(pb)
//解析分页条的信息
parseLimitBarInfo(pb,rname)
});
//最后可以让他每次跳完页面，定位到页面最上部
window.scrollTo(0, 0);
}
//一进来调用一下to_page()让他跳的第一页
to_page(cid,1,rname);
// 解析Rout的信息展示，
function parseRoutInfo(pb) {
var arr = pb.list;
var routeli = '';
arr.forEach(function (route) {
routeli += `<li><div class="img"><img src="${route.rimage}" style="width: 299px"></div>
<div class="text1"> <p>${route.rname}</p>
<br />
<p>${route.routeIntroduce}</p>
</div><div class="price"><p class="price_num"><span>¥</span>
<span>${route.price} </span><span>起</span></p>
<p><a href="route_detail.html?rid=${route.rid}">查看详情</a>
</p> </div></li>`;
});
//把li设置到ul中
$('#route_ul').html(routeli);
}
// 解析分页数据：
function parseLimitInfo(pb) {
$('#sp_totalPage').text(pb.pages);
$('#sp_totalItem').text(pb.total);
}
// 解析分页条的信息：
function parseLimitBarInfo(pb,rname) {
var li = '';
li += `<li onclick="to_page(cid,1,rname)"><a href="#">首页</a></li>`;
if(pb.firstPage){
li += `<li class="threeword" onclick="to_page(cid,1,rname})"><a href="#">上一页</a> </li>`;
}else{
li += `<li class="threeword" onclick="to_page(cid,${pb.pageNumber-1},rname)"><a href="#">上一页</a> </li>`;
}
//中间连续页码
var arr = pb.navigatePageNumbers;
arr.forEach(function (pageCode) {
if (pb.pageNumber == pageCode){
//如果当前页码==pageCode就高亮显示 class="curPage" 高亮 显示的类名
//绑定点击事件。传递cid和当前页码
li += `<li class="curPage" onclick="to_page(cid, ${pageCode},rname)"><a href="#">${pageCode}</a></li>`;
}else{
li += `<li onclick="to_page(cid, ${pageCode},rname)"><a href="#">${pageCode}</a></li>`;
}
});
if(pb.lastPage){
li += `<li class="threeword" onclick="to_page(cid,${pb.pages},rname)"><a href="#">下一页</a> </li>`;
}else{
li += `<li class="threeword" onclick="to_page(cid,${pb.pageNumber+1},rname)"><a href="#">下一页</a></li>`;
}
li += `<li onclick="to_page(cid,${pb.pages},rname)"><a href="#">末页</a></li>`;
//把li加到ul中
$('#ul_limit_bar').html(li);
}
<!--要获取cid的值-->
<script src="js/getUrlParam.js"></script>
<script>
header.html中
//点击搜索跳转到route_list.html页面，并携带参数cid 和 线路名称
$('#search_btn').click(function() {
//获取搜索框的内容
var rname = $('#search_in').val();
alert(rname);
//获取分类cid
var cid = UrlParam.param("cid");
//跳转到旅游页面并且携带参数
location.href= '/travel/route_list.html?cid=' + cid + '&rname='+rname;
});
1050
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
