ASD
ASD

Reputation: 4957

Loading data at end of scroll in jquery mobile

Am using dataprovider object to show the list with 25 records at a time and instead of pagination, i want to show next page at end of scroll using the following code. But is there any better way instead of window.location.href if not, is there any option to show the loading message till the page loads.

$(document).ready(function()
{
    $('#content').bind('scroll', function () 
    {   
        totalDivHeight = eval($('#content')[0].scrollHeight) - eval($('#content').height());
        scrollPosition =eval($('#content').scrollTop())+25;// + eval($('#content').height());

        if (scrollPosition >= totalDivHeight)
        {   
            nextPageID = eval("<?= $nextPageID; ?>");
            prevPageID = eval("<?= $prevPageID; ?>");
            totalPages = eval("<?= $totalPages; ?>");
            if (nextPageID < totalPages)
                window.location.href='<?php echo $url;?>'+'&Store_page='+nextPageID;

        }
    });

});

Edit: i tried ajax function instead of window.location.href but i dont know how to send the pagenumber variable to the provider?

Upvotes: 1

Views: 2022

Answers (1)

Pentium10
Pentium10

Reputation: 207830

You are probably looking to lazy load content and attach to the end of the table and you do that via ajax.

You should not reinvent the wheel others already have done this, just one of the implementations is here:

http://dcarrith.github.com/jquery.mobile.lazyloader/

Upvotes: 2

Related Questions