Issue during transition between views

[Рустем]

This issue happens not always and on views with big DOM.

At first the view1 is loaded. Then I pass to the view2. Everything is ok. 
when I fast pass from the view2 to the view3 - I see that on the view3 have header from the view2, but contents from the view2 is displayed. 
This issue i see in my app and in a simulator, but not always. If to look in chrome html inspector, it shows, as the view2 and the view3 have display:block.
When I press the button back, I pass from view3 to the view2, but with header from view1. This problem disappears only after reload app (simulator).

 

How to solve such problem?

[Tsvetina]

Hi Rustem,

This is not the regular behavior of Kendo Mobile views, so I will need to see your code in order to determine what causes the problem. You can paste here your views, layouts and any settings related to layouts and transitions. If you have a project in Telerik Platform that I can take a look at, please provide its name.

Regards,
Tsvetina
Telerik

 

 

[Рустем]

Project name - Blank_app. Problem pages - mobile/page-rent.html (page1), mobile/page-rent_details.html(page 2). 

you can try to reproduce this bug when you go from page 1 to page 2 and quickly you press backspace, and you can see that the header of page 1 remains on page 2

[Рустем]

I attached three screens where the problem is visible

[Tsvetina]

Hi Rustem,

The problem seems to be related to overlapping transitions. If you temporarily turn off transitions, you will see that the issue doesn't occur. You can go through your transition settings and confirm that you don't set transitions twice for one and the same navigation.

Also, I noticed that, on a device, you use native transitions, so this problem shouldn't occur there. However, you may encounter other issues with Kendo UI navigation as native transitions and Kendo UI navigation are not compatible out of the box (more info here).

Regards,
Tsvetina
Telerik

 

 

[Рустем]

thanks for the answer.

whether correctly I understood, what you suggests to use a plugin (native page transitions) for transitions between views?

whether such transition between local views will work? (for example 

window.plugins.nativepagetransitions.slide({

"href" : "#some_local_view"

});)

[Tsvetina]

Hi Rustem,

I noticed that you are already using the Native Page Transitions plugin and that is why I mentioned it. The plugin and Kendo UI aren't compatible out of the box, so you may need a lot of adjustments in your app if you want to keep using the plugin. Currently, your common navigation method (​natSlide) calls:

window.plugins.nativepagetransitions.slide({
    "direction":direction,
    "href" : href
});

when it runs on a device. If you don't need this code, and if the Kendo UI transitions work good for you, you can disable the plugin and remove this call from your code. If you want to keep using the plugin, you would need to follow the integration instructions from the plugin page I linked to in my previous post.

Regards,
Tsvetina
Telerik