ListView Endless Scrolling

5 posts, 0 answers
  1. Ariel
    Ariel avatar
    8 posts
    Member since:
    Sep 2014

    Posted 04 Dec 2014 Link to this post

    I have an issue where my list view Endless Scroller: When attempting to scroll the list view, sometimes the list view gets stuck further down the view that what it should. I am developing a hybrid app for mobiles in telerik appbuilder using icenium.

    <script type="text/javascript">
    var app = new kendo.mobile.Application(document.body, {
    skin: "flat",
    transition: "overlay"
    });
    function init1(e) {
    //----------------------------------//
    var category_name = "";

    debugger;

    var ds = new kendo.data.HierarchicalDataSource({
    schema: {
    total: function () { return 800; },
    model: {
    hasChildren: true
    },
    data: function (response) {
    // console.log(response);
    var data = [];
    var image = "";
    for (var i = 0; i < response.length; i++) {
    var date = $.format.date(response[i].date, "M-dd-yyyy");
    if (response[i].featured_image && response[i].featured_image.source) {
    image = response[i].featured_image.source;
    } else {
    image = "kendo/styles/images/full-color350px.png";
    }
    var item = {
    id: response[i].ID, //POST ID
    title: $('<span>').html(response[i].title).text(), //POST TILE
    date: date, //POST DATE
    author: response[i].author.username,
    image: image //POST FEATURED IMAGE
    };
    data.push(item);
    }
    return data;
    }
    },
    transport: {
    read: {
    url:url,
    dataType: "json",
    data: function () {
    if (category_name != "") {
    return {
    "filter[category_name]": category_name
    }
    }
    }
    }
    },
    serverPaging: true,
    pageSize: 25,
    requestStart: function (e) {
    app.pane.loader.show();
    $('.km-listview-wrapper').hide();
    },
    requestEnd: function (e) {
    app.pane.loader.hide();
    $('.km-listview-wrapper').show();
    }

    });


    if (e.view.params.catid) {
    if (e.view.params.catid != 0) {
    category_name = e.view.params.catid;
    } else {
    category_name = "";
    }
    }
    $("#latest-posts").kendoMobileListView({
    dataSource: ds,
    template: $("#latest-posts-template").html(),
    endlessScroll: true,
    pullToRefresh: true,
    type: "group"
    })


    }

    </script>
  2. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 08 Dec 2014 Link to this post

    Hi Ariel,

    Have you tried setting a bigger pageSize in the DataSource definition? For smoother scrolling, set the page size to (number of visible items on screen) * 3 * 2.

    If this does not help, also check the Output window for any JavaScript errors when you get the undesired behavior.

    Regards,
    Tsvetina
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
  3. Ariel
    Ariel avatar
    8 posts
    Member since:
    Sep 2014

    Posted 08 Dec 2014 in reply to Tsvetina Link to this post

    Hi Tsvetina,

        Thanks for replying, I have tried the same thing with small page size but did not get any success and also check the output window for javascript but there is no error.

     Please help.

    Regards,
    Nitish



  4. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 08 Dec 2014 Link to this post

    Hi Nitish,

    Let me just clarify, so we rule out this possible solution. My suggestion is to use a larger page size, for example 30 or more, not a smaller one.

    If the issue remains unresolved, another suggestion is to hook the DataSource error event and look for any problems while reading the data in there.

    Regards,
    Tsvetina
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
  5. Ariel
    Ariel avatar
    8 posts
    Member since:
    Sep 2014

    Posted 09 Dec 2014 in reply to Tsvetina Link to this post

    Hi Tsvetina,

      Thanks for reply again, as per your suggestion I use larger page size too but the issue remains unresolved and there is no error found in the DataSource error event. Please review my code again and give me some helpful advice.

    Regards,
    Nitish
Back to Top