Home/ Questions/Q 6590381
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T17:17:31+00:00

So I am having a hard time getting $.mobile.changePage to function properly. I call

  • 0

So I am having a hard time getting $.mobile.changePage to function properly. I call it like this: 

$.mobile.changePage( "DataformsM-AddRecord.html", { transition: "slide"} );

But for some reason, when the HTML page is loaded, none of the external .js (the files that I wrote to actually do something) are included. I am following the significant loading conventions of 

-Jquery
-(CUSTOM JS)
-Jquery Mobile

Does anyone know why this is not getting loaded properly? Also, the pageshow function is not getting fired either, which is strange. It looks like this:

$("div[data-role*='page']").live('pageshow', function(event, ui) { 

    loadFormFields();

});

Now the page is rendered, but none of the functional things happen. If I hack it and do something like this: 

document.location.href="DataformsM-AddRecord.html";

It will function properly.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    jQuery Mobile does not pull the whole page into the dom, it grabs the first data-role="page" element and its descendants and pulls that into the current dom.

    So any scripts in the <head> of the document will not be included.

    I generally put all the functional JavaScript for my site on the index page and then when external pages are loaded into the dom they can benefit from the already loaded scripts.

    Also, you can place JavaScript code inside the data-role="page" element and it will be included when jQuery Mobile does its AJAX load of the page.

    UPDATE

    A good system for this is to put all of your JS into an include file and include it on each page of the site. It will be ignored if pages are brought into the DOM by AJAX, but if someone refreshes somewhere in your site, the JS will be available.

    • 0