Jquery ile Scroll indikçe Veri Yüklemek

Merhabalar,
Herkesin bildiği gibi Facebook uygulamasındayken, scrool ile sayfanın aşağısına inince veriler otomatik olarak yükleniyor. Bu uygulama çok hoşuma gitmişti. Bende Javada yapmak istedim.
Php'de bulduğum örneği Javada uyarladım sizlere.

Eclipse Projesi: indir

Veritabanı Yapısı

CREATE TABLE 'actor_info' (
  'id' int(5) NOT NULL AUTO_INCREMENT,
  'first_name' varchar(45) NOT NULL,
  'last_name' varchar(45) NOT NULL,
  'film_info' text NOT NULL,
  PRIMARY KEY ('id')
) ENGINE=InnoDB DEFAULT CHARSET=latin1

ConnectionFactory.Java

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
 
public class ConnectionFactory {
    //static reference to itself
    private static ConnectionFactory instance = new ConnectionFactory();
    String url = "jdbc:mysql://localhost/test";
    String user = "username";
    String password = "password";
    String driverClass = "com.mysql.jdbc.Driver"; 
 
    //private constructor
    private ConnectionFactory() {
        try {
            Class.forName(driverClass);
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }
    }
    public static ConnectionFactory getInstance()   {
        return instance;
    }
    public Connection getConnection() throws SQLException,
    ClassNotFoundException {
        Connection connection =
            DriverManager.getConnection(url, user, password);
        return connection;
    }
}

EmployeeDAO.Java

import java.util.ArrayList;
import java.util.List;
import java.sql.*;
 
public class EmployeeDAO {
Connection connection;
    Statement stmt;
    private int noOfRecords;

    public EmployeeDAO() { }
 
    private static Connection getConnection() throws SQLException,ClassNotFoundException{
        Connection con = ConnectionFactory.
                getInstance().getConnection();
        return con;
    }
    public List<MyData> viewAllEmployees(int offset,int noOfRecords)
    {
        String query = "select SQL_CALC_FOUND_ROWS * from actor_info ORDER BY id DESC limit "
                 + offset + ", " + noOfRecords;
        List<MyData> list = new ArrayList<MyData>();
        MyData employee = null;
        try {
            connection = getConnection();
            stmt = connection.createStatement();
            ResultSet rs = stmt.executeQuery(query);
            while (rs.next()) {
                employee = new MyData();
                employee.setId(rs.getInt("id"));
                employee.setName(rs.getString("first_name"));
                employee.setLastname(rs.getString("last_name"));
                employee.setInfo(rs.getString("film_info"));
                list.add(employee);
            }
            rs.close();
 
            rs = stmt.executeQuery("SELECT FOUND_ROWS()");
            if(rs.next())
                this.noOfRecords = rs.getInt(1);
        } catch (SQLException e) {
            e.printStackTrace();
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }finally
        {
            try {
                if(stmt != null)
                    stmt.close();
                if(connection != null)
                    connection.close();
                } catch (SQLException e) {
                e.printStackTrace();
            }
        }
        return list;
    }
    public int getNoOfRecords() {
        return noOfRecords;
    }
}

MyData.Java

public class MyData {
 private int id;  
    private String name;
    private String lastname; 
    private String info;
    
 
 public int getId() {
  return id;
 }
 public void setId(int id) {
  this.id = id;
 }
 public String getName() {
  return name;
 }
 public void setName(String name) {
  this.name = name;
 }
 public String getLastname() {
  return lastname;
 }
 public void setLastname(String lastname) {
  this.lastname = lastname;
 }
 public String getInfo() {
  return info;
 }
 public void setInfo(String info) {
  this.info = info;
 }
}

index.jsp

<%@page import="com.sample.EmployeeDAO"%>
<%@page import="com.sample.MyData"%>
<%@page import="java.util.*"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
 <link rel="stylesheet" href="css/style.css">
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 <script type="text/javascript" src="js/jquery-ias.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
         // Infinite Ajax Scroll configuration
            jQuery.ias({
                container : '.wrap', // main container where data goes to append
                item: '.item', // single items
                pagination: '.nav', // page navigation
                next: '.nav a', // next page selector
                loader: '<img src="css/ajax-loader.gif"/>', // loading gif
                triggerPageThreshold: 3 // show load more if scroll more than this
            });
        });
    </script>
</head>
<% 
 String next="";
 int pagee=1;
 int limit=10;
 
 if(request.getParameter("p")!=null)       
   pagee=Integer.parseInt(request.getParameter("p"));
 
 EmployeeDAO dao = new EmployeeDAO();
 
 int start = (pagee * limit)-limit;
 List<MyData> list = dao.viewAllEmployees(start,limit);
 
 int rowCount = dao.getNoOfRecords();
 int noOfPages = (int) Math.ceil(rowCount * 1.0 / limit);
 if( rowCount > (pagee * limit) ){
  next = ++pagee+"";
}

 %> 
 <body><div class="wrap">
 
<%
 for (MyData m:list) {
 
  %>
     <div class="item" id="item-<%=m.getId()%>">
  <h2>
   <span class="num"><%= m.getId()%></span>
   <span class="name"><%= m.getName()%> <%=m.getLastname()%></span>
  </h2>
  <p><%=m.getInfo()%></p>
 </div>
     <%
 }
%>
<!--page navigation-->
 <% if (next!=null){ System.out.println(next); %>
 <div class="nav">
  <a href='index.jsp?p=<%=next%>'>Next</a>
 </div>
 <%}%>

</div><!--.wrap-->
</body>
</html>

style.css

*{
 margin: 0;
 padding: 0;
 box-sizing: border-box;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-font-smoothing: antialiased;
 -moz-font-smoothing: antialiased;
 -o-font-smoothing: antialiased;
 font-smoothing: antialiased;
 text-rendering: optimizeLegibility;
}
body{
 font: 12px Arial,Tahoma,Helvetica,FreeSans,sans-serif;
 text-transform: inherit;
 color: #333;
 background: #e7edee;
 width: 100%;
}
.wrap{
 width: 720px;
 margin: 15px auto;
 padding: 15px 10px;
 background: white;
 border: 2px solid #DBDBDB;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 border-radius: 5px;
 overflow: hidden;
}
.item{
 margin: 10px 0;
 padding: 5px 10px;
 background: #f9f9f9;
 border-radius: 5px;
}
a{ text-decoration: none; color: #333}
h1{
 font-family: Georgia, "Times New Roman", Times, serif;
 font-size: 2.8em;
 text-align: center;
 margin: 15px 0;
}
h2{font-size: 1.5em; margin: 8px 0}
h2 span.name{font-size: 1em}
h2 span.num{font-size: 1.5em; font-style: italic}
.item p{text-transform: lowercase}

/*Loader style*/
.ias_loader, .ias_trigger {
 text-align:center;
 margin: 30px 0 40px;
}
.ias_trigger a:link,
.ias_trigger a:visited {
    padding: 4px 50px;

    background-color: #f9f9f9;
    border: solid 1px #ddd;
    border-radius: 2px;

    font: bold 12px Arial, sans-serif;
    color: #555;
    text-decoration: none;
}
.ias_trigger a:hover,
.ias_trigger a:active {
    border-color: #ccc;
}