Our website is built on a content management system called dotcms. I’m working in a dotcms version 2.2 environment and I’m logged into the administrative portal and am testing a new JQuery mobile page. The language I use to write our widgets, for the site is velocity and both the dollar-sign (“$”) and the hash mark (“#”) are on every line of code depending on whether I’m referring to a variable(all variables start with a “$”) or issuing a directive(directives all begin with a “#”). So when writing code using JQuery everytime a dollar-sign is needed I have to code it like this:

                ${esc.d}

which also makes things more difficult when trying to use JQuery. I’m have been using  JQuery 1.7.2  with the “noConflict()” option for a few months with no real problems, because our site also uses other javascript libraries, including at least one older version of JQuery.

Now we’re getting ready to add some new pages just for mobile devices, and I’m trying to figure out how to start using jquery.mobile-1.2.0 and not having much luck so far. According to the jQuery Mobile website version 1.2.0 is supposed to be compatible with jQuery-1.7.2. However when I add a line of javascript in the template on the page to put in a reference for where to find jquery-mobile then I’m getting errors. If I try to use the full version of jquery.mobile-1.2.0 with JQuery-1.7.2, I get this error from FireFox/FireBug:

this.loaderWidget is undefined

loading()jquery....2.0.js (line 948)

showPageLoadingMsg(theme=undefined, msgText=undefined, textonly=undefined)jquery....2.0.js (line 939)

initializePage()jquery....2.0.js (line 9085)

(?)()jquery....2.0.js (line 9140)

fire(context=Document test-request-mobile-page.html?mainFrame=true&livePage=0&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84, args=[function()])jquery-1.7.2.js (line 1075)

fireWith(context=Document test-request-mobile-page.html?mainFrame=true&livePage=0&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84, args=[function()])jquery-1.7.2.js (line 1193)

ready(wait=undefined)jquery-1.7.2.js (line 435)

DOMContentLoaded()jquery-1.7.2.js (line 949)

Then if I instead try to use the minified version of jquery.mobile-1.2.0  I get this error:

this.loaderWidget is undefined

silentScroll()jquery....min.js (line 2)

silentScroll(b=undefined, c=undefined, d=undefined)jquery....min.js (line 2)

silentScroll()jquery....min.js (line 2)

silentScroll()jquery....min.js (line 2)

fire(context=Document test-request-mobile-page.html?mainFrame=true&livePage=0&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84&host_id=39597d98-38a3-4686-ad7a-58f96de5af84, args=[function()])jquery-1.7.2.js (line 1075)

fireWith(context=Document test-request-mobile-page.html?mainFrame=true&livePage=0&language=1&host_id=39597d98-38a3-4686-ad7a-58f96de5af84&host_id=39597d98-38a3-4686-ad7a-58f96de5af84, args=[function()])jquery-1.7.2.js (line 1193)

ready(wait=undefined)jquery-1.7.2.js (line 435)

DOMContentLoaded()jquery-1.7.2.js (line 949)