1

I want to programmatically change my jquery mobile page. I have read stackoverflow pages here

https://stackoverflow.com/a/24173950/4278933

jQuery mobile pagecontainer load()

and failed to get my code working. Sometimes I get an error on the console, sometimes I get nothing (no url change, gui change or console log output).

(Note, I am navigating TO f.html which is an external page).

All attempts to change the page are done AFTER device ready...

First method I tried was 

<a href="f.html" id="front" data-rel="external" data-ajax="false">Front</a>

and then I triggered 

$("#front").trigger("click");

With the above, nothing worked (no error or url change). However, manually clicking on the link achieved the page change I wanted.

Then I read http://api.jquerymobile.com/pagecontainer/#method-change and combined with the two SO posts noted above, I tried

$( ":mobile-pagecontainer" ).pagecontainer( "load", "f.html" );

and also tried

$( "body" ).pagecontainer( "load", "f.html");

I get Error: cannot call methods on pagecontainer prior to initialization; attempted to call method 'load'

Where am I going wrong?

Community
  • 1
  • 1

1 Answers1

0

Because you don't want AJAX loading and you really want the browser to navigate to the new page (without loading it into the current DOM), you can just use the normal JavaScript Window.location object:

location.assign("f.html");

DEMO

ezanker
  • 24,628
  • 1
  • 20
  • 35
  • Your suggestion worked, but I decided to use $("body").load("f.html"); so that I can retain the scripts/variables already available to the DOM. –  Nov 03 '16 at 13:42
  • @fiprojects, I made that assumption because you had data-ajax="false" and data-rel="external" on the link. – ezanker Nov 03 '16 at 17:02