Hi Guys, We have written code to load records while scrolling down page (lazyloading) in Cordova Mobile App.

It improves UI/ UX and code is easy to manage.

Please go through below description and code:

[b]Trick[/b] we have used: [b]we load the records, when load-more div is visible on scrolling down.
[/b]

We have implemented the same in Jito App and it's working fine.

# Please refer below code:-

We have taken code reference from [i]Enquiry listing page of Jito App[/i].

[b]HTML:[/b]
[code]


[/code]

[b]Java Script:[/b]
[code]
jQuery("#enquiry-loadmore").data('start',lastid);
lazyLoading(); //this function is responsible for Loading records on scroll down

function lazyLoading(){
var temp = 1;
$('#pages_maincontent,.search_members_wrap,ul').scroll(function(){ // 'pages_maincontent' is id of main div
var e = $('.loadmorediv');

if(isElementVisible(e)){

if(e && $(".loadmorediv").is(":visible")){
console.log("load");
var url = window.location.href ;
var id = getParameterByName('id',url);

if(id){
var is_number = Number.isInteger(id);
}
else{
var is_number = true;
}

if(is_number && temp == '1'){
jQuery(".loadmorediv").trigger("click"); // triggers when load-more div visible
temp++;
}
}
}
});
}
[/code]


Refer Jito App code for the same.

Note: Latest code is available on GIT.