Using Mobile with MVC pages that have _Layout.cshtml

[DezTech]

I am using MVC4 and displaying mobile views to mobile clients. Each page makes use of the master page (_Layout.Mobile.cshtml) which has the layout definition, references to the mobile CSS, JS and initializes the kendo application.

From the examples I have seen, it appears you are suppose to have the layout definition only once, then, every other page should just have a <div> with a data-role="view". This way, when clicking links the ajax call simply gets the contents of the view and replaces the current view.

Currently, when I try to link between pages, the "loading" flickers non-stop. I believe that problem is that the ajax call to get the page is expecting only the <div data-role="view">, but I'm providing a page with everything on it.

Is there a way to just get the contents of the <div data-role="view">, similar to how jquery's load() takes the URL and an optional selector?

[Petyo]

Hello Aaron,

We have a very similar case in our mobile demos. What we did was a server-side detection, which determined if the request was ajax or not. If the request was ajax, we serve the page with an empty layout. 

A thing to notice is that the problem you experience is due to the fact that each remote page re-instantiates a mobile application in its scripts. When the mobile application loads a remote view, it also parses any scripts and styles found in the body (if such is present). 

Regards,
Petyo
the Telerik team