Jquery mobile change page

Question

I have two column layout for a webpage from the site, http://jquerymobile.com/demos/1.0.1/

Now they have provided provisions to changePage using <a href="#xxx" data-role="button">Sample</a>

But my question is how to programmatically change page using code.

$.mobile.changePage("#xxx"); isn't working for me

Answer 1

Here is a real simple example for you: http://jsfiddle.net/shanabus/YjsPD/

$.mobile.changePage("#page2");

Documentation: http://api.jquerymobile.com/jQuery.mobile.changePage/

Other examples:

//transition to the "about us" page with a slideup transition
$.mobile.changePage( "about/us.html", { transition: "slideup"} );

//transition to the "search results" page, using data from a form with an ID of "search""   
$.mobile.changePage( "searchresults.php", {
    type: "post",
    data: $("form#search").serialize()
});

//transition to the "confirm" page with a "pop" transition without tracking it in history   
$.mobile.changePage( "../alerts/confirm.html", {
    transition: "pop",
    reverse: false,
    changeHash: false
});

UPDATE

As Chase Roberts points out in the comments below, this changePage method was deprecated in version 1.4. Here is the documentation for the new pagecontainer change event.

Example:

$.mobile.pageContainer.pagecontainer("change", "#page", { options });

This was also addressed on this SO question: How to change page in jQuery mobile (1.4 beta)?