bootstrap分页查询传递中文参数到后台(get方式提交)

复制代码
<!--分页 -->
        <div style="width: 380px; margin: 0 auto; margin-top: 50px;">
            <ul class="pagination" style="text-align: center; margin-top: 10px;">
                <!-- 上一页 -->
                <!-- 判断当前页是否是第一页 -->
                <c:if test="${pageBean.currentPage==1 }">
                    <li class="disabled"><a href="javascript:void(0);"
                        aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
                    </a></li>
                </c:if>
                <c:if test="${pageBean.currentPage!=1 }">
                    <li><a
                        href="${pageContext.request.contextPath }/fenYe?currentPage=${pageBean.currentPage-1}&queryName=${queryName}&queryAddress=${queryAddress}&queryDate=${queryDate}&getTag=getMethod"
                        aria-label="Previous"> <span aria-hidden="true">&laquo;</span>
                    </a></li>
                </c:if>




                <c:forEach begin="1" end="${pageBean.totalPage }" var="page">
                    <!-- 判断当前页 -->
                    <c:if test="${pageBean.currentPage==page }">
                        <li class="active"><a href="javascript:void(0);">${page}</a></li>
                    </c:if>
                    <c:if test="${pageBean.currentPage!=page }">
                        <li><a class="test"
                            href="${pageContext.request.contextPath }/fenYe?currentPage=${page}&queryName=${queryName}&queryAddress=${queryAddress}&queryDate=${queryDate}&getTag=getMethod">${page}</a></li>
                    </c:if>

                </c:forEach>

                <!-- 判断当前页是否是最后一页 -->
                <c:if test="${pageBean.currentPage==pageBean.totalPage }">
                    <li class="disabled"><a href="javascript:void(0);"
                        aria-label="Next"> <span aria-hidden="true">&raquo;</span>
                    </a></li>
                </c:if>
                <c:if test="${pageBean.currentPage!=pageBean.totalPage }">
                    <li><a class="test"
                        href="${pageContext.request.contextPath }/fenYe?currentPage=${pageBean.currentPage+1}&queryName=${queryName}&queryAddress=${queryAddress}&queryDate=${queryDate}&getTag=getMethod"
                        aria-label="Next"> <span aria-hidden="true">&raquo;</span>
                    </a></li>
                </c:if>

            </ul>
        </div>
        <!-- 分页结束 --> 
复制代码

 

jQuery对其url进行编码:(参考JS对URL编码http://www.cnblogs.com/qlqwjy/p/7435054.html)

    $(".test").each(function() {
        var h = $(this).attr("href");
        $(this).attr({
            href : encodeURI(h)
        });
    });

 

 后台对接收的参数进行解码:

复制代码
String getTag = request.getParameter("getTag");
        // 组装查询条件
        Condition condition = new Condition();

        // 组装名称
        String queryName = request.getParameter("queryName");
        // 如果是点击页号提交方式为get提交进行转码
        if (getTag != null && !"".equals(getTag.trim())) {
            queryName = new String(queryName.getBytes("iso-8859-1"), "utf-8");
        }
        if (queryName != null && !"".equals(queryName)) {
            condition.setQueryName(queryName);
            // 回显数据
            request.setAttribute("queryName", queryName);
        }
复制代码

 

  上面的getTag标志是get方式提交,需要进行解码,如果为post提交不进行解码条件。

  对提交的英文与数字参数不需要进行解码。

   

 

还有一种方式是:ajax采用post方式提交,请求JSON,然后将JSON填充到表格。

复制代码
         $.ajax({
            url:"${baseurl}/fenYe",
            async:true,
            type:"POST", 
date:{"currentPage":1,"queryName":"${queryName}","queryAddress":"${queryAddress}","queryDate":"${queryDate}"},
            success: function(data){
                },
            error:function(){
                alert("请求失败");
                },
            dataType:"json"
           
        }); 
复制代码

 

 后台将查询到的数据转换为JSON串返回,ajax在成功的回调函数将JSON数据填入表格,关于JSON填充表格参考:

http://www.cnblogs.com/qlqwjy/p/7307514.html

 

posted @   QiaoZhi  阅读(1836)  评论(0编辑  收藏  举报
编辑推荐:
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· Obsidian + DeepSeek:免费 AI 助力你的知识管理,让你的笔记飞起来!
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示