ListView DataSource data update stops the scrolling while on PhoneGap

2 posts, 0 answers
  1. Gustavo
    Gustavo avatar
    5 posts
    Member since:
    May 2013

    Posted 29 Aug 2013 Link to this post

    Hi,

    Using:
    Kendo UI Beta v2013.2.716
    PhoneGap 3.0.0-0.14.0

    I have a ListView that will freeze the scrolling when the datasource data changes, and if the user is scrolling at the time the data refresh occurs:

    //This is some fake data
    var zoneData = [
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'},
                        {zoneNumber: 1, zoneName: 'name', group: '1-9'}
                        ];

    //The data source
    var theDataSource = kendo.data.DataSource.create({
                    data: zoneData
                });

    //This is how the listview is initialized when the view loads
    $('#statusZoneRows').kendoMobileListView({
                dataSource: theDataSource,
                template: $('#statusZoneRowTemplate').html(),
                headerTemplate: $('#statusZoneRowHeaderTemplate').html()
    });

    //This is how the dataSource is updated later on in the app ...
    zoneData.push({zoneNumber: 2, zoneName: 'A new name', group: '1-9'});
    theDataSource.data(zoneData);


    Does anyone know why would the the scrolling freeze up when the data is added?  Again this seems on only happen if the user is scrolling. 

    Thanks
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 30 Aug 2013 Link to this post

    Hi Gustavo,

    This is expected behaviour as the scroller get the position of the scroll point and when the data is changed this position is lost, so the scrolling is broken. It is a pretty complex problem, but we had a similar case before and a workaround was found, please refer to this forum thread:

    http://www.kendoui.com/forums/mobile/listview/scrolling-stops-working-when-setting-data-source.aspx

    Or you can check this example (does not work in desktop browser, but when deployed with PhoneGap should be working, as I have tested it)

    http://jsbin.com/uqizAyo/2/edit
     
    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top