Question

Hi all I am navigating from one html page to another as:

window.location = "test.html";  

In test.html I have header as:

<script type="application/javascript">

            function redirect()
            {
                alert("inside redirect:");
                //window.location = url;
                //history.back();
                history.go(-1);
                return false;

            }

        </script>

        <div data-role="navbar">
            <ul>

                <li> <a href="#" data-theme="b" onclick="history.back(); return false;">Go Back</a></li>
                <li> <a onclick="redirect()" data-icon="back" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Back1</a></li>

            </ul>
        </div>

But here both back buttons (Go Back and Back1) are not working. If I use $.mobile.changePage('test.html') to navigate between pages then both Back buttons work. Why they are not with windows.location?

I want to develop this application for B-Grade browser which are not support ajax. Therefore I cant use $.mobile.changePage('test.html').

Any help will be appreciated. Thanks.

Answer 1

This Blackberry OS 5 browser has lots of issue. Initially i also tried to do what you are doing right now. But later i think so you will have to think of some other approach which is better. Here is how i solved it

First of all add these lines before loading the jquery-mobile script like this

<script type="text/javascript">
    $(document).bind("mobileinit", function() {
        $.support.cors = true;
        $.mobile.allowCrossDomainPages = true;
    });
</script>

Then i used the Single Html concept. In this concept i had to load my script just once and i could make use of jquery-mobile’s changePage. When i had many html pages then i has to wait for some seconds as loading and unloading of scripts took place. Avoid that, Its unnecessarry.

Have all the pages with in the same Html like this

<div data-role="page" id="page1">
<div data-role="page" id="page2">
.
.
.

Then after that you can easily do a changePage like this

$.mobile.changePage("#page1", {
    transition : "slide"
});

I hope you take the right approach.