javascript - pagecontainer change function not working

Question

I can get the pagecontainer change function to work inside a function that is called with a button click. But for some reason the pagecontainer change function isn't working when I run the code outside of a function. I do a check to see if a user is logged in and then want to do a page change/redirect if they aren't logged in.

 <script>
//works
    function test() {
        $(':mobile-pagecontainer').pagecontainer('change', '#event-list-page');
    }
//doesn't work
    var user = window.localStorage.getItem("user");
    if (user == null){
        alert('not logged in. Should redirect.');
        $(':mobile-pagecontainer').pagecontainer('change', '#event-list-page');
    }
 </script>

What is the best solution for this problem? Should I just do a javascript redirect? Or do I need to wait for the page to load all the way or something?

Answer 1

You should intiate the $.mobile.pageconatiner first, example:

$.mobile.pageContainer.pagecontainer({ defaults: true });