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-1)*pageSize>=0?(pageNum-1)*pageSize:0,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 = "5") int pagesize,
                @RequestParam(value = "pagenum", required = false, defaultValue = "1") int pagenum){
            int recordCount = positionMgr.getAll().size();
            int pageCount = (recordCount+pagesize-1)/pagesize ;
            model.addAttribute("pageTitle", "Position List");
            return "positionlist";
        }
        
        @RequestMapping("/positionlistajax")
        public @ResponseBody List<</span>Position> listPositionDo(Model model,
                @RequestParam(value = "pagesize", required = false, defaultValue = "5") int pagesize,
                @RequestParam(value = "pagenum", required = false, defaultValue = "1") int pagenum){        
            List<</span>Position> ret = positionMgr.getPagePosition(pagenum, pagesize);
            return ret;
        }

 

View层：

 

    <</span>script type="text/javascript">
            var pageIndex = 0;
            var pageSize = 5;
            $(function () {
               
                    pageIndex = 1;
                    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 = 1;
                AjaxGetData( pageIndex, pageSize);
            }
            
            function GoToPrePage() {
                pageIndex -= 1;
                pageIndex = pageIndex >= 1 ? pageIndex : 1;
                AjaxGetData( pageIndex, pageSize);
            }
           
            function GoToNextPage() {
                if (pageIndex <</span> parseInt($("#count").text())) {
                    pageIndex += 1;
                }
                    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>= 0 || pageIndex > parseInt($("#count").text())) {
                        pageIndex = tempPageIndex;
                        alert("Please input valid page scope!");
                    }
                    else {
                        AjaxGetData(pageIndex, pageSize);
                    }
                }
            }
        <</span>/script>

 

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