分页:AJAX异步处理+Servlet+JQuery
•发布于   •作者 Choices()  •307 次浏览  •来自 博客

                                   分页

一.需求分析:


1.我们要的需求,我们要做什么?


通过这个图我们就可以知道:

a.查询所有用户表信息

b.每页显示规定的行数

c.点击按钮可以换页

d.每次换页时页次会变化

e.输入查询值时,会调到指定的页数

2.知道了需求之后我们的思路是什么:


3.知道了思路后,我们大体上要用什么样的知识呢?(具体的后面会说到)

a.html知识;

b.js中的JQquery

c.AJAX异步和JSON

d.配置XML文件

e.一些servlet的post操作

二.具体操作

1.具体知识准备

a.AJAX异步的知识:

异步简介:在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。

异步方法的具体实现

$(function(){
    $('#send').click(function(){
         $.ajax({
             type: "GET",
             url: "test.json",
             data: {username:$("#username").val(), content:$("#content").val()},
             dataType: "json",
             success: function(data){
                         $('#resText').empty();   //清空resText里面的所有内容
                         var html = ''; 
                         $.each(data, function(commentIndex, comment){
                               html += '<div class="comment"><h6>' + comment['username']
                                         + ':</h6><p class="para"' + comment['content']
                                         + '</p></div>';
                         });
                         $('#resText').html(html);
                      }
         });
    });
});

b.JQuery方法实现(下一页)


	function nextPage(){
  	//获取当前页
  		var page=$("#page").val();
  		var totalPage=$("#totalPage").val();
  		if(page<totalPage){
  			list(Number(page)+1,5);
  		}else{
  			alert("已经是最后一页了");
  		}
  	}

c.Servlet中的处理

1.Servlet中分页使用的知识点:

1).几个变量

当前的页码page、当前页码中的显示的条数rows、总条数totalSize、每页的起始行startIndex

2).计算公式:

总条数totalSize=((totalSize+rows-1)/rows);

每页的起始行startIndex=((page-1)*rows);

3)使用的 SQL语句

获取总行数:select count(*) total from 表名

查询一段数据:select * from t_user limit startIndex,rows

4)使用集合存值

Map<String,Object> m=new HashMap<String,Object>();

5).将放入map集合中的值打包传到json中,

response.getWriter().print(JSON.toJSON(m));

6).在AJAX中success中获取(里面的data就是发送过来的map结合)

7).对传过来的值进行异步和jQuery操作(看上)



0 回复
回到顶部

©2017 Powered by 三十三行伪代码
皖ICP备17005175号-3