cordova - jQuery Mobile changePage() not working in Windows Phone

Question

I am developing an application using Phonegap for Windows Phone 8.

I've used jQuery Mobile for interface design.

the $.mobile.changePage() is not working. The page is not being changed.

Is there any other way to change the page? Is there any other framework to design the interface for mobile?

$("#btnSearch").bind('click', function() {
    showSpinner();
    $.mobile.changePage("#pageSearch");
});

Answer 1

I think this problem is the same as in WP7 described here.

CHECK FOR PATH PROBLEM:

if($.mobile.path.getLocation("x-wmapp1:/app/www/index.html") != "x-wmapp1:/app/www/index.html")
{
    console.log('there is path problem');
}
else
{
    console.log('everything is OK with paths');
}

SOLUTION:

As described in github, problem is path on WP7 differs from other platforms. Basically on WP7 getLocation prints relative paths with double slashes, which causes this issue at first place. To fix, open jquery.mobile-1.3.1.js and refactor following:

-        var uri = url ? this.parseUrl( url ) : location,
-          hash = this.parseUrl( url || location.href ).hash;
+        var uri = this.parseUrl( url || location.href ),
+          hash = uri.hash;

and:

-        return uri.protocol + "//" + uri.host + uri.pathname + uri.search + hash;
+        return uri.protocol + uri.doubleSlash + uri.host + uri.pathname + uri.search + hash;

After making this changes, check should display "everything is OK".

PS This is tested on WP7 and totally fixed my issue with $.mobile.changePage().

PS2 This issue is fixed at github version of jQuery, although I've just checked latest stable version(1.3.2) and unfortunately it is NOT fixed there.

Regards,

Hristo Todorov