i have repeater control which will display a 100000 messages, i don't want to use different pages to show all the messages to the user.. Instead i want to load the while the user scrolls down, rather then loading all the messages in one time.
As an example: Facebook timeline.
thanks
Edited : what i tried :
<script type="text/javascript">
$(document).ready(function e() {
$(window).scroll(function () {
if ($(window).scrollTop() == $(document).height() - $(window).height()) {
GetRecords();
}
});
function GetRecords() {
$("#loader").show();
$.ajax({
type: "POST",
url: "Demo.aspx/GetList",
data: {},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert("Failure");
},
error: function (response) {
alert("Error");
}
});
}
function OnSuccess(response) {
$.map(response.d, function (item) {
$('#division').append("<div style='line-height:25px;'>" + item + "</div>");
});
$("#loader").hide();
}
});
</script>
code behind
public partial class Demo : System.Web.UI.Page
{
static List<string> list = new List<string>();
static int n=0;
protected void Page_Load(object sender, EventArgs e)
{
n = 0;
}
public Demo()
{
for (int i = 1; i <= 1000; i++)
{
list.Add("List Item : " + i);
}
}
[WebMethod]
public static List<string> GetList()
{
var fiftyItems = list.Skip(n).Take(50);
n = n + 50;
return fiftyItems.ToList();
}
}
but i want to work with more complected control , something like you saw in facebook, comments, pictures, etc..