1

I have a page called index.html, when I click the link in index html it will navigate to the another page which has Listview populated with data taken from Server. This Works without any error.

However, when I click the back button of current page, I will be directed to the previous page.

My question is, it refreshes current page and then go back to the previous page. I need to prevent this.

index.html

<!DOCTYPE HTML>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>Untitled Document</title>
            <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
            <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
            <script language="text/javascript">
                /* VERY IMPORTANT this is before loading jquery.mobile JS */
                $(document).on("mobileinit", function() {
                    // Make your jQuery Mobile framework configuration changes here!
                    $.mobile.allowCrossDomainPages = true;
                    $.mobile.ajaxEnabled = true;
                });

            </script>
            <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
            <script type="text/javascript">
                $(document).on("pagebeforeshow", function(event) {
                    $("#mybtn").bind("click", function(e) {
                        $.mobile.showPageLoadingMsg();
                        $.mobile.changePage("twitter.html", {
                            reloadPage: true, changeHash: true
                        });

                    });
                });

                $(document).on("pagehide", "div[data-role=page]", function(event) {
                    $(event.target).remove();
                });

            </script>
        </head>

        <body>
            <div data-role="page" id="reviewsPage">

                <div data-role="header">
                    <h1>Reviews</h1>
                    <a href="#" id="mybtn" class="ui-btn-right" data-ajax="false" >TWEET</a>
                </div>

            </div>
        </body>
    </html>

tweet.html

 <div data-role="page" id="twitterPage"  >
    <script type="text/javascript">

        $(document).on("pagehide", "div[data-role=page]", function(event) {
            $(event.target).remove();
        });

         $(document).bind('pagebeforeshow', '#twitterPage', function(){

        });
    </script>

    <div data-role="header" data-add-back-btn="true" data-back-btn-text="Previous" >
        <a href="#" data-rel="back" data-icon="arrow-l">Back</a>

    </div>
    <div data-role="content">
        <ul id="tweet-list" data-role="listview" data-inset="true">
            <li data-role="list-divider">
                <p>
                    Tweets
                </p>
            </li>
        </ul>
    </div>
</div>
12
  • are you sure it goes to previous page? your code removes previous page from DOM. What do you mean by "it refresh the current page and then go back to the previous page"?
    – Omar
    Oct 18, 2013 at 10:36
  • Yeah i can go to the previous page(index.html).Refreshing previous page is my List View has only 2 items(Taken from server) when i click to the back it will add another two items and go back to previous.I think it requesting data from server again Oct 18, 2013 at 10:42
  • $(document).bind('pagebeforeshow', function(event, data) { this is being called again when you go back to index.html. add page id like this $(document).bind('pagebeforeshow', '#tweets', function()
    – Omar
    Oct 18, 2013 at 10:45
  • I change the code as you said(See my update).But nothing happen Oct 18, 2013 at 10:52
  • for tweets.html, wrap your content in <div data-role="page" id="tweets"></div>
    – Omar
    Oct 18, 2013 at 10:54

1 Answer 1

0

unbind all events

 `  $("#mybtn").unbind();`
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.