带查询条件的分页在点击下一页时如何保存住条件

celine1227 发布于 05/29 16:33
阅读 184
收藏 1

输入price的两个数字点submit能正常显示,而点击下一页时变成了显示所有结果的页面。

感觉上script代码没起作用,求助!!!

如图

点击下一页后

工程结构如下

jsp页面(红色部分是为了保存住条件加的代码)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    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>Insert title here</title>
<script type="text/javascript" src="/script/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $function(){
        $("a").click(function(){
            var serializeVal = $(":hidden").serialize;
            var href = this.href + "&" + serializeVal;
            window.location.href = href;
            
            return false;
        });
        
        $("#pageNo").change(function(){
            var val = $(this).val();
            val = $.trim(val);
            //1.校验val是否为数字
            var reg = /^\d+$/g;
            if(!reg.test(val)){
                alert("输入的不是合法的页码");
                $(this.val(""));
                return;
            }
            //2.校验val在一个合法的范围内1-totalPageNumber
            var pageNo = parseInt(val);
            if(pageNo < 1 || pageNo > parseInt("${bookpage.totalPageNumber}")){
                alert("输入的不是合法的页码");
                $(this.val(""));
                return;
            }
            
            //页面跳转
            var href = "bookServlet?method=getBooks&pageNo" + pageNo + "&" + $(":hidden").serialize();
            window.location.href = href;
        });
    }
</script>
</head>
<body>
    <input type="hidden" name="minPrice" value="${param.minPrice}"/>
    <input type="hidden" name="maxPrice" value="${param.maxPrice}"/>
    <center>
        <br><br>
        <form action="bookServlet?method=getBooks" method="post">
            Price:
            <input type="text" size="1" name="minPrice"/> -
            <input type="text" size="1" name="maxPrice"/>
            
            <input type="submit" value="submit"/>
        </form>
        
        <br><br>
        <table cellpadding="10">
            <c:forEach items="${bookpage.list}" var="book">
                <tr>
                    <td>
                        <a href="">${book.title}</a>
                        <br>
                        ${book.author}
                    </td>
                    <td>${book.price}</td>
                    <td><a href="">加入购物车</a></td>
                </tr>
            </c:forEach>
        </table>
        
        <br><br>
        共${bookpage.totalPageNumber}页
        &nbsp;&nbsp;
        当前第${bookpage.pageNo}页
        &nbsp;&nbsp;
        <c:if test="${bookpage.hasPrev}">
            <a href="bookServlet?method=getBooks&pageNo=1">首页</a>
            &nbsp;&nbsp;
            <a href="bookServlet?method=getBooks&pageNo=${bookpage.prevPage}">上一页</a>
        </c:if>
        &nbsp;&nbsp;
        <c:if test="${bookpage.hasNext}">
            <a href="bookServlet?method=getBooks&pageNo=${bookpage.nextPage}">下一页</a>
            &nbsp;&nbsp;
            <a href="bookServlet?method=getBooks&pageNo=${bookpage.totalPageNumber}">末页</a>
        </c:if>
        &nbsp;&nbsp;
        
        转到 <input type="text" size="1" id="pageNo"/> 页
        
    </center>
</body>
</html>

加载中
0
MiniDoraemon
MiniDoraemon

把金额填进那两个输入框里面

0
celine1227
celine1227

引用来自“MiniDoraemon”的评论

把金额填进那两个输入框里面

第一张图就是填完金额点击submit后的结果共13页,而全部结果是22页。

MiniDoraemon
MiniDoraemon
你查询完后把参数放进input里面 点下一页再把这个参数一起传过去就ok了
0
绿水本无忧
绿水本无忧

查询的条件要保存在全局变量里,捕获下一页的点击事件 自行组装URL进行跳转,用GET传参的形式最简单

0
你不懂的吧
你不懂的吧

举个例子  <a href="bookServlet?method=getBooks&pageNo=${bookpage.nextPage}">下一页</a> 这个地方 你要么传minPrice 和mmaxPrice两个参数过去  ,要么可以换成<a onclick=”nextPage(${bookpage.nextPage})“>下一页</a>   然后再js里面nextPage方法 调用form.submit()

0
celine1227
celine1227

感谢以上各位。现在很确定是js代码不执行了,连最简单的alert("hello");都不执行。

然而因为js里还有校验代码,绕不开,还请各位大牛们帮帮忙,谢谢!

0
celine1227
celine1227

已解决

1.js的function左边少括号

2.引入js文件时src里最前面多了/

3.直接copy下面的网址中的js代码就好用了

http://www.bubuko.com/infodetail-1934349.html

返回顶部
顶部