Note that there are some explanatory texts on larger screens.

plurals
  1. POStrange behaviour within jQuery Mobile app with cached page
    text
    copied!<p>sorry for the not so perfect title, but i don't know how to explain my problems in few words. searching the internet didn't brought me a solution, so I want to try here.</p> <p>i have got a mobile app build on jQuery mobile 1.1.1 (jQuery 1.7.1) and MVC2. there are two files that represent two pages. the first page stays in cache / dom when opening the second. both pages / views are created from the same controller 'myController':</p> <p>page1 (first page):</p> <pre><code>&lt;div id="page1" data-role="page" data-dom-cache="true"&gt; ... &lt;a href="~/myController/page2" data-role="button" data-ajax="true"&gt;...&lt;/a&gt; ... &lt;/div&gt; </code></pre> <p>page2 (second page):</p> <pre><code>&lt;div id="page2" data-role="page"&gt; ... &lt;/div&gt; </code></pre> <p><b>first problem:</b> on page2 i have an ajax function that calls a server mvc action:</p> <pre><code>$.ajax( { type: "GET", url: "serverAction?bar=foo, success: function (res) { ... } }); </code></pre> <p>when calling page1 and then going to page2, the ajax function calls server action 'serverAction' in controller 'myController' - url looks like this:</p> <pre><code>http://localhost:xxxxx/myController/serverAction?... </code></pre> <p>when calling page1, going to page2 and making a site refresh via F5 the same ajax function calls server action with wrong / no controller. url looks like this:</p> <pre><code>http://localhost:xxxxx/serverAction?... </code></pre> <p>why is this behaviour and how to avoid it?</p> <p><b>second problem:</b> as i need my page1 in cache because page2 updates some attributes of page1, i redirect back to page one like this:</p> <pre><code>&lt;a rel="external" href="#page1"&gt;...&lt;/a&gt; </code></pre> <p>thats works perfectly until i make an refresh, because then the site is newly loaded and page1 is not there any more. because of this i write some javascript that reload page1 on pageinit of page2:</p> <pre><code>$(this).bind('pageinit', function () { if ($("#page1").length &lt;= 0) $.mobile.loadPage("~/myController/page1", { showLoadMsg: false }); }); </code></pre> <p>that works in most cases, but sometimes there is a strange behaviour: coming from page1 to page2, refreshing the site (and waiting until page1 is reloaded correctly). then when i click on the back link that looks like this</p> <pre><code>http://localhost:xxxxx/myController/page2#page1 </code></pre> <p>page1 appears, but reloads itself in a loop... url then looks like:</p> <pre><code>http://localhost:xxxxx/myController/page1#page1 </code></pre> <p>i treid to fix the two problems the whole day, but no way. i really don't know whats going on. </p> <p>thanks for all help and tipps. if you need more information for answering this question please ask...</p> <p>thanks a lot!</p> <p>best regards...</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload