As you noticed, you need to set $.mobile.pushStateEnabled = false, but there is a lot more to being able to replace JQM's built-in navigation support.
I've created a complete example for enabling PathJS support here http://jsfiddle.net/kiliman/4dkP8/ and a live version here http://systemex.net/jqm/pathjs/ so you can see what the URLs look like. You can even book mark a hash link and it'll navigate to the correct page.
First you need to disable JQM's default hash support
$(document).bind('mobileinit', function() {
// disable autoInit so we can navigate to bookmarked hash url
$.mobile.autoInitializePage = false;
// let PathJS handle navigation
$.mobile.ajaxEnabled = false;
$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;
$(document).bind('pagebeforechange', function(e, data) {
var to = data.toPage;
if (typeof to === 'string') {
var u = $.mobile.path.parseUrl(to);
to = u.hash || '#' + u.pathname;
// manually set hash so PathJS will be triggered
location.hash = to;
// prevent JQM from handling navigation
e.preventDefault();
}
});
});
Next build up your PathJS routes. For this example, I'm simply navigating to existing pages, but you can dynamically generate pages based on the current hash. Make sure you pass in the following options: dataUrl and changeHash.
Path.map('#/store/movies/star-wars').to(function() {
// setup options: update dataUrl and prevent JQM from changing hash
var options = {
dataUrl: location.toString(),
changeHash: false
};
// navigate to page object
$.mobile.changePage($('#movies-star-wars'), options);
});
Path.map('#/store/books/authors/tolkien').to(function() {
var options = {
dataUrl: location.toString(),
changeHash: false
};
$.mobile.changePage($('#books-authors-tolkien'), options);
});
Path.map('').to(function() {
var options = {
dataUrl: '',
changeHash: false
};
$.mobile.changePage($('#home'), options);
});
Path.root('');
Finally, you need to initialize the page, then start PathJS.
$(function() {
// initialize page
$.mobile.initializePage();
// startup PathJS
Path.listen();
});
Hope this helps.
