spring mvc实现ajax 分页

使用到的技术：

·spring 3 mvc

·json

·jquery

·java

·mysql

首先，要了解如何在spring
mvc中使用json。

以下主要从Dao和View及Controller来分析：

Dao层：

    public List<</span>Position> getPagePosition(int pageNum,int pageSize){
      //select * from t_position order by id desc limit (pageNum-1)*pagesize , pagesize
            List<</span>Position> list = jdbc.query("select * from position order by id desc limit ?,? ", new Object[]{(pageNum-)*pageSize>=?(pageNum-)*pageSize:,pageSize},
                    new RowMapper<</span>Position>() {
                        public Position mapRow(ResultSet rs, int rowNum)
                                throws SQLException {
                            return populate(rs);
                        }
                    }
            );
            return list;
        }

Controller中代码：

    @RequestMapping("/positionlist")
        public String listPosition(Model model,
                @RequestParam(value = "pagesize", required = false, defaultValue = "") int pagesize,
                @RequestParam(value = "pagenum", required = false, defaultValue = "") int pagenum){
            int recordCount = positionMgr.getAll().size();
            int pageCount = (recordCount+pagesize-)/pagesize ;
            model.addAttribute("pageTitle", "Position List");
            return "positionlist";
        }

        @RequestMapping("/positionlistajax")
        public @ResponseBody List<</span>Position> listPositionDo(Model model,
                @RequestParam(value = "pagesize", required = false, defaultValue = "") int pagesize,
                @RequestParam(value = "pagenum", required = false, defaultValue = "") int pagenum){
            List<</span>Position> ret = positionMgr.getPagePosition(pagenum, pagesize);
            return ret;
        }

View层：

    <</span>script type="text/javascript">
            var pageIndex = ;
            var pageSize = ;
            $(function () {

                    pageIndex = ;
                    AjaxGetData(pageIndex, pageSize);

            });

            function AjaxGetData( index, size) {
                $.ajax({
                    url: "${pageContext.request.contextPath}/positionlistajax",
                    type: "Get",
                    data: "pagenum=" + index + "&pagesize=" + size,
                    dataType: "json",
                    success: function (json) {

    var html = "";
                         html += "<table>";
                         html += "<thead>";
                         html += "<tr><th colspan=7 >Position List</th></tr>";
                         html += "<tr><th>ID</th><th>Name</th><th>Location</th><th>Nature</th><th>Number</th><th>End Date</th><th>Operation</th></tr>";

                         html += "</thead>";
                         html += "<tbody>";
                       for(position in json){
                       html += "<tr>";
                       html += "<td>"+json[position].id+"</td>";
                           html += "<td>"+json[position].name+"</td>";
                           html += "<td>"+json[position].location+"</td>";
                           html += "<td>"+json[position].nature+"</td>";
                           html += "<td>"+json[position].number+"</td>";
                           html += "<td>"+json[position].endDate+"</td>";
                           html += "<td><a href='editposition?id="+json[position].id+"'>Edit&nbsp;<a href='position?id="+json[position].id+"'>View</td>";
                           html += "</tr>";

                       }
                       html += "</tbody>";

                      html += "<tfoot>";
                      html += "<tr>";
                      html += "<td colspan='7'>";
                      html += "<span>Total Records:" + ${recordCount} + "; Total Page:<span id='count'>" +${pageCount} + "" + "";
                      html += "<a href='javascript:void' onclick='GoToFirstPage()' id='aFirstPage' >First&nbsp;&nbsp; ";
                      html += "<a href='javascript:void' onclick='GoToPrePage()' id='aPrePage' >Pre&nbsp;&nbsp; ";
                      html += "<a href='javascript:void' onclick='GoToNextPage()' id='aNextPage'>Next&nbsp;&nbsp; ";
                      html += "<a href='javascript:void' onclick='GoToEndPage()' id='aEndPage' >Last&nbsp;&nbsp; ";
                      html += "<input type='text' size='4' /><input type='button' value='Jump' onclick='GoToAppointPage(this)' /> ";
                      html += "</td>";
                      html += "</tr>";
                      html += "</tfoot>";
                      html += "</table>";
                      //alert(html);
                       $('#divResult').html("");
                       $('#divResult').html(html);

                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(XMLHttpRequest);
                        alert(textStatus);
                        alert(errorThrown);
                    }
                });
            }

            function GoToFirstPage() {
                pageIndex = ;
                AjaxGetData( pageIndex, pageSize);
            }

            function GoToPrePage() {
                pageIndex -= ;
                pageIndex = pageIndex >=  ? pageIndex : ;
                AjaxGetData( pageIndex, pageSize);
            }

            function GoToNextPage() {
                if (pageIndex <</span> parseInt($("#count").text())) {
                    pageIndex += ;
                }
                    AjaxGetData( pageIndex, pageSize);
            }

            function GoToEndPage() {
                pageIndex = parseInt($("#count").text()) ;
                AjaxGetData( pageIndex, pageSize);
            }

            function GoToAppointPage(e) {
                var page = $(e).prev().val();
                if (isNaN(page)) {
                    alert("Page should be a valid number");
                }
                else {
                    var tempPageIndex = pageIndex;
                    pageIndex = parseInt($(e).prev().val());
                    if (pageIndex <</span>=  || pageIndex > parseInt($("#count").text())) {
                        pageIndex = tempPageIndex;
                        alert("Please input valid page scope!");
                    }
                    else {
                        AjaxGetData(pageIndex, pageSize);
                    }
                }
            }
        <</span>/script>

<</span>div id="divResult" ><</span>/div>