AJAX异步分页查询

  1. 跳转页面(不请求数据)
@RequestMapping("/list")
public String list() {
	return "/manag/user/list";
}
  1. 使用ajax分页查询数据
<script type="text/javascript">
    $(function () {
        pageQuery(1);
    });
    
    // 模糊查询
    var flag = false;
    $("#queryBtn").click(function () {
        var querytext = $("#queryText")
        if (querytext.val() == "") {
            layer.msg("请输入查询条件", {time: 1000, icon: 5, shift: 6}, function () {
                querytext.focus();
            });
        } else {
            flag = true;
            pageQuery(1);
        }
    });

	// 分页查询
    function pageQuery(pageno) {
        var loadingIndex = -1;
        var paramData = {
            pageno: pageno,
            pagesize: 2
        };
        if (flag) {
            paramData.queryText = $("#queryText").val();
        }
        $.ajax({
            type: "post",
            dataType: "JSON",
            url: "${APP_PATH}/manag/user/pageQuery.do",
            data: paramData,
            beforeSend: function () {
                loadingIndex = layer.msg('请求中', {icon: 16});
            },
            success: function (result) {
                layer.close(loadingIndex);
                if (result.success) {
                    var page = result.page;
                    var userDatas = page.datas;

                    var userContent = "";
                    $.each(userDatas, function (index, user) {
                        userContent = userContent + '<tr>';
                        userContent = userContent + '   <td>' + (index + 1) + '</td>';
                        userContent = userContent + '   <td><input type="checkbox"></td>';
                        userContent = userContent + '   <td>' + user.loginacct + '</td>';
                        userContent = userContent + '   <td>' + user.username + '</td>';
                        userContent = userContent + '   <td>' + (user.email || "") + '</td>';
                        userContent = userContent + '   <td>';
                        userContent = userContent + '       <button type="button" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>';
                        userContent = userContent + '       <button type="button" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>';
                        userContent = userContent + '       <button type="button" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';
                        userContent = userContent + '   </td>';
                        userContent = userContent + '</tr>';
                    })
                    $("#userContent").html(userContent);

                    var pageContent = "";
                    if (pageno != 1) {
                        pageContent = pageContent + '<li><a style="cursor: pointer" οnclick="changePageno(' + (pageno - 1) + ')">上一页</a>'
                    }
                    for (var i = 1; i <= page.totalno; i++) {
                        pageContent = pageContent + '<li ' + (pageno == i ? 'class="active"' : '') + '><a style="cursor: pointer" οnclick="changePageno(' + i + ')">' + i + '</a></li>';
                    }
                    if (pageno != page.totalno) {
                        pageContent = pageContent + '<li><a style="cursor: pointer" οnclick="changePageno(' + (pageno + 1) + ')">下一页</a>'
                    }
                    $(".pagination").html(pageContent);
                } else {
                    layer.msg("请求失败", {time: 1000, icon: 5, shift: 6});
                }
            }
        });
    }

	// 跳转分页
    function changePageno(pageno) {
        pageQuery(pageno)
    }
</script>
  1. controller
    @ResponseBody
    @RequestMapping("pageQuery")
    public Object pageQuery(String queryText,Integer pageno, Integer pagesize) {
        AjaxResult result = new AjaxResult();
        try {
            HashMap<String, Object> paramMap = new HashMap<String, Object>();
            if (!StringUtil.isEmpty(queryText)) {
                paramMap.put("queryText", queryText);
            }
            paramMap.put("start", (pageno - 1) * pagesize);
            paramMap.put("size", pagesize);

            // 查询当前页的所有数据
            List<User> users = userService.queryPageUser(paramMap);

            // 获取总的数据数量
            int totalsize = userService.queryPageCount();
            // totalno : 总页数
            int totalno = 0;
            if (totalsize % pagesize == 0) {
                totalno = totalsize / pagesize;
            } else {
                totalno = totalsize / pagesize + 1;
            }

            Page<User> userPage = new Page<User>();
            userPage.setDatas(users);
            userPage.setTotalsize(totalsize);
            userPage.setTotalno(totalno);
            userPage.setPageno(pageno);

            result.setPage(userPage);
            result.setSuccess(true);
        } catch (Exception e) {
            e.printStackTrace();
            result.setSuccess(false);
        }
        return result;
    }
发布了43 篇原创文章 · 获赞 0 · 访问量 510

猜你喜欢

转载自blog.csdn.net/qq_35199832/article/details/104158925
今日推荐