Skip to content

Instantly share code, notes, and snippets.

Created June 21, 2011 14:08
Show Gist options
  • Save scottjehl/1037934 to your computer and use it in GitHub Desktop.
Save scottjehl/1037934 to your computer and use it in GitHub Desktop.
jQuery Mobile: Simple dynamic page creation
/* Dynamically create a page and navigate to it.
(and include the page in browser history ) */
//create markup
var newPage = $("<div data-role=page data-url=yay><div data-role=header><h1>YAY!!!!</h1></div><div data-role=content><img src= /></div></div");
//append it to the page container
newPage.appendTo( $.mobile.pageContainer );
//go to it
$.mobile.changePage( newPage );
Copy link

tbeseda commented Sep 6, 2011

Is the data-url attribute important?

Copy link

ngardner commented Sep 7, 2011

The data-url is required for the browser history, so the browsers "back" button works correctly. Its value is insignificant it just has to be there.

Copy link

vrcosta commented Nov 21, 2011

If I set the data-url attribute and press the back button, it produces the following error:

PhoneGapLog(480): file:///android_asset/www/js/phonegap-1.1.0.js: Line 930 : JSCallback Error: Request failed.

Any idea? Thanks.


Updating to phonegap 1.2 and JQM 1 dit not solved my problem.

Copy link

Thank you so much! This finally worked for me!

Copy link


Any luck with that? I'm getting the same problem with PhoneGap 1.2 and JQM 1.0

Copy link

vrcosta commented Apr 19, 2012

I only got it to work without any problems with PhoneGap 1.3!

Copy link

lucian1900 commented Apr 19, 2012 via email

Copy link

Thank you for sharing! Works like a charm.

Copy link

Thank you! Does exactly what I was looking for.

Copy link

Thanks in advance, i want to replace the page. Can you upload the code for replace?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment