How to inject the same panel into multiple pages using jquery mobile

jQuery Mobile >= 1.4 Solution one: Use an External panel that can be accessed from any page, this is in case you want to have the same panel contents in all pages. Append panel to $.mobile.pageContainer once only on pagebeforecreate and then enhance the panel using $(“.selector”).panel(). var panel=”<div data-role=”panel” id=”mypanel” data-position=”right” data-display=”push”><h1>Panel</h1><p>stuff</p></div>”; $(document).one(‘pagebeforecreate’, function … Read more

How do you remove a button’s active state with jQuery Mobile?

You can disable the ‘highlighted blue’-state in the ‘mobileinit’-event before loading jQueryMobile-script: <head> <script> $(document).bind(‘mobileinit’, function () { $.mobile.activeBtnClass=”unused”; }); </script> <script src=”http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js”></script> </head> Now, when you click on a link, no class will be added after the click is performed. You will still have the ‘hoover’ and ‘down’ classes.

Phonegap Android Back Button – close app with back button on homepage

Update: this has stopped working with a latest Phonegap update (supposedly). Feel free to offer a working solution if you know it. Here’s how I do it: document.addEventListener(“backbutton”, function(e){ if($.mobile.activePage.is(‘#homepage’)){ /* Event preventDefault/stopPropagation not required as adding backbutton listener itself override the default behaviour. Refer below PhoneGap link. */ //e.preventDefault(); navigator.app.exitApp(); } else { navigator.app.backHistory() … Read more

Sencha Touch or jQuery Mobile? [closed]

Sencha Touch is an application framework (you create your interface programmatically through Javascript) while jQuery Mobile is more of a mobile enhancement library (you write regular HTML for your content, then add jQuery mobile for transitions/animations). jQuery Mobile has an easier learning curve, but Sencha Touch can better simulate “native” apps.

jQuery Mobile Page refresh mechanism

function refreshPage() { jQuery.mobile.changePage(window.location.href, { allowSamePageTransition: true, transition: ‘none’, reloadPage: true }); } Taken from here http://scottwb.com/blog/2012/06/29/reload-the-same-page-without-blinking-on-jquery-mobile/ also tested on jQuery Mobile 1.2.0

How to get query params for internal page link in JQuery Mobile

jQuery Mobile ignores (removes) querystring parameters in URL and shows URL with hash only. However, you can retrieve querystring only on pagecontainerbeforechange and when data.toPage is a string not an object. At this stage, full URL is stored in data.absUrl. You may use $.mobile.path.parseUrl().search method to retrieve querystring, or you can use .split(“?”), both should … Read more