Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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=http://bukk.it/yay.gif /></div></div");
//append it to the page container
newPage.appendTo( $.mobile.pageContainer );
//go to it
$.mobile.changePage( newPage );
@tbeseda

This comment has been minimized.

Copy link

tbeseda commented Sep 6, 2011

Is the data-url attribute important?

@ngardner

This comment has been minimized.

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.

@vrcosta

This comment has been minimized.

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.

EDIT:

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

@benburton

This comment has been minimized.

Copy link

benburton commented Jan 17, 2012

Thank you so much! This finally worked for me!

@lucian1900

This comment has been minimized.

Copy link

lucian1900 commented Apr 19, 2012

@hypept

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

@vrcosta

This comment has been minimized.

Copy link

vrcosta commented Apr 19, 2012

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

@lucian1900

This comment has been minimized.

Copy link

lucian1900 commented Apr 19, 2012

@raduGaspar

This comment has been minimized.

Copy link

raduGaspar commented Apr 4, 2013

Thank you for sharing! Works like a charm.

@kshrawan

This comment has been minimized.

Copy link

kshrawan commented Jul 25, 2013

Thank you! Does exactly what I was looking for.

@shashikantkumar88

This comment has been minimized.

Copy link

shashikantkumar88 commented Jan 29, 2014

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
You can’t perform that action at this time.