Tuesday, June 19, 2012

Jquery Mobile Dialog when ajax is disabled

Click Here:

Normally, dialog boxes in JQM do not require full HTML pages, just HTML snippets (e.g. :layout => nil) as they are loaded via AJAX and work like jQuery UI dialogs.

However, when you set "$.mobile.ajaxEnabled = false" JQM will no longer load dialogs via ajax, EVEN if you set "data-ajax=true" on the dialog links. That seems like a bug to me, ignoring "data-ajax=true". A patch to fix the problem:
diff --git js/jquery.mobile.navigation.js js/jquery.mobile.navigation.js
index f85a491..181b9c9 100755
--- js/jquery.mobile.navigation.js
+++ js/jquery.mobile.navigation.js
@@ -1322,10 +1322,11 @@
                        var baseUrl = getClosestBaseUrl( $link ),
 
                                //get href, if defined, otherwise default to empty hash
-                               href = path.makeUrlAbsolute( $link.attr( "href" ) || "#", baseUrl );
+                               href = path.makeUrlAbsolute( $link.attr( "href" ) || "#", baseUrl ),
+        isTargetDialog = $link.data("rel") === "dialog";
 
                        //if ajax is disabled, exit early
-                       if( !$.mobile.ajaxEnabled && !path.isEmbeddedPage( href ) ){
+                       if( !$.mobile.ajaxEnabled && !isTargetDialog && !path.isEmbeddedPage( href ) ){
                                httpCleanup();
                                //use default click handling
                                return;