Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Really Problem with infinite list lazy list in pages

  • I use requireJs to create a project. i need to have infinite scroll list in some pages. i use these for example to run page. for first time works correclty but when i back to that page not work ( i mean nothing shown in infinite list):

    I use it for run some function when page shown:

        document.addEventListener("show", function(event) {
            var page =;
            if ( == "pageSpecialOffer") {
        }, false);

    and the function to create infinite list:

        function createMainList() {
            var data = {};
            data.cityId = parseInt(bigFoot.variable.cityID);
            api.getMainList(data).done(function(list) {
                    var iListSpecialOffer = document.getElementById('SpecialOfferByCategoryInfiniteList');
                    iListSpecialOffer.delegate = {
                        createItemContent: function(index, template) {
                            var t2 = '<ons-list-item tappable modifier="longdivider" server-id="' + list[index].CategoryId + '">';
                            t2 += list[index].CategoryIcon;
                            t2 += '<div class="title">' + list[index].CategoryName + '</div>';
                            if (list[index].SpecialOffersTotal == 0) {
                                t2 += '<span class="notification notification--material empty">' + list[index].SpecialOffersTotal + '</span>';
                            } else {
                                t2 += '<span class="notification notification--material">' + list[index].SpecialOffersTotal + '</span>';
                            t2 += '</ons-list-item>';
                            // console.log(ons.createElement(t));
                            return ons.createElement(t2);
                        countItems: function() {
                            return list.length;
                        destroyItem: function(index, element) {
                            // console.log(index);

    above code i delete some unnecessary codes , that works for first time but when back and come again nothing shown in infinite list, but i have some data to show.

    please help me for that. i thing there is problem with delegate i used because i use the same code in other pages where needs to have infinite list scroll. thank you

  • I need to say i use pushPage to navigate between pages but when i use resetToPage all infinite list or lazy repeat list will work correctly.

    i really confuse !!!

    is there any way to show data in lazy repeat or infinite scroll beside delegate method ???

  • Onsen UI

    @meisam3322 Do you mean that when running popPage the list disappears? Try to use the init event instead of show.