jquery mobile Index page shows and then flips to account-login?
-
19-10-2022 - |
Question
I have an index page which calls the security script to see if you are logged in. This is set in a pagebeforeshow event
$(document).off('pagebeforeshow', '#index')
.on('pagebeforeshow', '#index', function() {
var pagetag = "index";
window.localStorage.setItem("keytag", pagetag);
init();
});
as this code is running and then executes that the user is not logged in. It flashes the content of the index page for a second and then proceeds to the login page. Which event is best to run before the page is ever created to first check logged in so i dont get a flash of the index.html
my init() part for clarity
function security(){
$.ajax({
url: "http://m.mysite.com/ajaxResponder.php?method=security",
dataType: 'html',
complete: function(data){
if(data.responseText == 'logout'){
$(':mobile-pagecontainer').pagecontainer('change', 'account-login.html', {
transition: 'none',
changeHash: false,
reverse: true,
showLoadMsg: false
});
}else {
//stay on index page
}... continued script etc
Answer to anyone else who is after this. (thanks to Omar for the heads up)
I added
data-needs-auth="true"
to page div.
and i added this code
$(document).on('pagebeforechange', function (event,data) {
if (data.toPage[0].id == "index" && data.toPage.attr('data-needs-auth') == 'true'){
if (!window.localStorage.getItem("login")) {
$.mobile.changePage("account-login.html", { changeHash: false });
event.preventDefault();
}
}
});
No correct solution
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow