Issue refreshing datasource bound to listview with fixed headers

11 posts, 0 answers
  1. RICHARD FRIEND
    RICHARD FRIEND avatar
    16 posts
    Member since:
    Nov 2008

    Posted 04 Jul 2013 Link to this post

    Hi
     I am having an issue when you scroll down a listview with fixed headers then refresh the list the headers get all out of sync.

    Example here http://jsfiddle.net/M5FHN/9/

    Scroll down then click refresh, then scroll up and the fixed headers are messed up - its like its not counting the offset of the current scroll position when redrawing.


    Any ideas how to get over this?

    Cheers
  2.
  3. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 05 Jul 2013 Link to this post

    Hi Richard,

    From the JSFiddle I can see that your are using an old version of Kendo UI - 2012.2.710. I have tested your code with the latest version - 2013.1.703 and it is working just fine. You can find the latest version on the website under Manage Products (you have to be logged in).

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. RICHARD FRIEND
    RICHARD FRIEND avatar
    16 posts
    Member since:
    Nov 2008

    Posted 05 Jul 2013 Link to this post

    Hi

    I am actually using the latest beta - and i get this behavior, is there a way to alter the jsFiddle to use the beta and i will try and re-create it..


    Richard
  7. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 05 Jul 2013 Link to this post

    Hello Richard,

    I have created a JSFiddle with the latest kendo.mobile.all.min.css and kendo.all.min.js files. that you can use to re-create your project.

    http://jsfiddle.net/B4zy4/
     
    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. RICHARD FRIEND
    RICHARD FRIEND avatar
    16 posts
    Member since:
    Nov 2008

    Posted 05 Jul 2013 Link to this post

    Hi Kiril

    I have got it to do it with the beta

    http://jsfiddle.net/B4zy4/3/

    for some reason i couldnt get the data-init or the click to work, so i fudged it with setTimeout - just scroll straight away then wait for the alert and it goes fubarred again.

    Cheers
  11. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 05 Jul 2013 Link to this post

    Hi Richard,

    I have checked the JSFiddle and indeed the headers are not refreshed after dataSource.fetch(). This is an issue with ListView, and not a problem with your code. I have logged a case and it will be fixed with one of the next Internal Builds. 

    As a gesture of gratitude I have updated your Telerik Points balance.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  13. RICHARD FRIEND
    RICHARD FRIEND avatar
    16 posts
    Member since:
    Nov 2008

    Posted 05 Jul 2013 Link to this post

    Thanks Kiril

    It might also be the same issue but when the datasource changes and becomes empty, the previous headers can sometimes remain.

    http://jsfiddle.net/cbXGU/


    Thanks
  14.
  15. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 05 Jul 2013 Link to this post

    Hello Richard,

    I will add this clarification to the already opened case.

    Thank you very much for your cooperation
     
    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  17. RICHARD FRIEND
    RICHARD FRIEND avatar
    16 posts
    Member since:
    Nov 2008

    Posted 18 Jul 2013 Link to this post

    Hi although this is improved in the new release, and works if you refresh the current datasource - it is still busted when changing the datasource.


    http://jsfiddle.net/52kyv/

    Scroll to bottom then wait for the datasource to change and you end up with only one header (resize browser and it redraws correct)
    Dont scroll and just wait and its fine.
  19. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 19 Jul 2013 Link to this post

    Hi Richard,

    I have checked the fiddle you sent us. This a new scenario - different than the previous one that was fixed. I can confirm that changing the dataSource unfortunately breaks the Kendo UI Mobile ListView. It is logged as a bug and will be fixed soon.

    As a gesture of gratitude I have updated your Telerik Points balance.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  21. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 23 Jul 2013 Link to this post

    Hello Richard,

    I am following up regarding the problems that you had with Kendo UI Mobile ListView and especially the fixed headers, and how they behave when the dataSource is refreshed. 

    Basically the listview behaves as expected, the problem comes from the fact that the shorter list (after the dataSource is refreshed) needs to have its scroller reset, in order to calibrate for the new(shorter) ListView length. This is why in the refresh function you need to call:

    kendo.mobile.application.scroller().reset();

    For your convenience here is a jsFiddle example which demonstrates a possible implementation. Please take a look at it and tell us if you have any troubles with it.

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top