Beginner
Beginner

Reputation: 1424

$.mobile.changePage is not working

I am using $.mobile.changePage to transit on a new page upon clicking on listview element.

This is how I am using it,

$('ul').children('li').on('click', function () {
 created_date = $.trim($(this).text());
 $.mobile.changePage( "Image.html", {
  transition: 'slide',
  reverse: 'true'
 });                    
});

This is the html page

<div data-role="page" id="SavedImage" >
 <div data-role="header">
  <h1></h1>
  <a href="#"></a>
 </div>
 <div data-role="content">
  <img src="Image/InScope.png" alt="" style="height:100%; width:100%;" />
 </div>
 <div data-role="footer">
 </div>
</div>

It transits to image.html,When I click on back button it must go to listview.But it transits to listview page and again come backs to image.html page.

How to prevent it to coming back to image.html.

Upvotes: 1

Views: 1125

Answers (2)

Gajotres
Gajotres

Reputation: 57309

I cant see rest of your code but I think I understand your problem. If I deduced it correctly your problem is easily solvable and I think you didn't told us everything.

Let me guess, first time it works great but every other time there's a problem you have described.

Change your click binding code to this:

$('ul').children('li').off('click').on('click', function () { 
    created_date = $.trim($(this).text());

    $.mobile.changePage( "Image.html", {
                        transition: 'slide',
                        reverse: 'true'
    });
});

Basically each time you return to your list page click event will be bind again. With each bind a click on li element will trigger several changePage events that will cause your problem.

Upvotes: 1

mpatel
mpatel

Reputation: 486

I don't see an error in your code, this might be a bug of some unexpected behaviour of a browser. Things to consider: I have faced similar issues but i have done below things.You can try this.

  • try removing href="#" from the link
  • put false in reverse value.
  • Instead of using changePage() apply directly href="Image.html" data-transition="slide"
  • In the click and return false.

If Any of above doesn't work then go to this question.It's same question what you have asked.

jquery-mobile-change-page-to-itself

Upvotes: 1

Related Questions