I'm developing an app for windows phone. The app itself is working fine except for the back button (of the device). The back button can navigate back correctly until a certain point where it stops. At this point it shows the AJAX loader. If the back button is pressed again, the app closes.
The structure of my app is as follows (I'm using a multi-page structure):
App loads -> user has to pick language -> main screen with buttons to other pages
At the main screen the user can navigate further into the app. The back button works correctly until the main screen has to be show again.
Here's an example of how the main screen looks like:
<div data-role="page" id="zero">
<div data-role="content">
<a href="#one" data-role="button" id="button-one" data-icon="plus">button-one</a>
<a href="#two" data-role="button" id="button-two" data-icon="plus">button-two</a>
<a href="#three" data-role="button" id="button-three" data-icon="plus">button-three</a>
<a href="javascript:randomFunction();" data-role="button" id="button-four" data-icon="plus">button-four</a>
</div>
</div>
I use a few buttons that activate a javascript function. At the end of these functions, I use $.mobile.changePage("#four");
to navigate to the page.
All of the buttons work correctly, but when navigating back to the main screen, it stops and shows the AJAX loader.
Maybe some useful information - my device ready function looks like this:
*If localstorage contains a value for the language, set the language and navigate to the main screen.
*If the localstorage does not contain a value for the language, navigate to the page where the user can choose the language.
NOTE: when pressing the back button at the page where the user can choose a language, the app closes (normal), after this, the user is navigated to the main screen. If the back button is pressed here, the app closes as well. I find this a bit odd, because I think it has to navigate back to the language option page.