Issue refreshing datasource bound to listview with fixed headers

[RICHARD FRIEND]

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

[Kiril Nikolov]

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

[RICHARD FRIEND]

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

[Kiril Nikolov]

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

[RICHARD FRIEND]

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

[Kiril Nikolov]

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

[RICHARD FRIEND]

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

[Kiril Nikolov]

Hello Richard,

I will add this clarification to the already opened case.

Thank you very much for your cooperation
 
Regards,
Kiril Nikolov
Telerik

[RICHARD FRIEND]

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.

[Kiril Nikolov]

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

[Kiril Nikolov]

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