Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Highlighted
Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom
Accepted Solution

jQuery Mobile app doesn't work on OS5 phone, but works in simulator

Hi

 

I'm trying to run a simple jQuery Mobile (beta2) app on my phone and its not working.

 

Had ported a working app and it worked on simulator but didn't get past the loading screen on Curve8900 phone.

Then created a simple jQuery Mobile app that displays a header, content (with listview) and footer.

 

When I load in simulator it looks fine, but when I load on phone it loads and shows a blank screen with a small grey square in top left corner of screen ... (maybe 30x30 pixels or less)

 

(the rest of the screen is green, as I set the background in config.xml to green)

 

I have specified:

<meta name="viewport" content="width=device-width,height=device-height,user-scalable=no,initial-scale=1.0">

 

and also tried using:

        addEventListener('load', doLoad, false);

        function doLoad() {
            document.body.style.height = screen.height + 'px';
            alert('initPage 3');
        }

 

but makes no difference.

 

(Before I added jQuery to app it worked fine) - very tedious to debug since I need to sign code everytime I test and reboot phone after install Smiley Sad

 

Any help appreciated.

Maybe someone has a skeleton jQueryMobile app that works on OS5 ?

 

 

 

Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

I have build the same skeleton without jQuery & jQuery mobile and it displays on 8900 Curve phone.

 

Then I added back jQuery/Mobile includes and it broke again - ie just showing a few small grey square in upper left corner of screen after initial loading screen completes.

<link rel="stylesheet" href="jQuery/jquery.mobile-1.0b2.min.css" />
<script type="text/javascript" src="jQuery/jquery-1.6.2.min.js"></script>


<script type="text/javascript" src="jQuery/jquery.mobile-1.0b2.min.js"></script>         <!-- link after custom javascript -->

 

 

Below is a snippet from DEBUG Logs - I cleared just before i entered the app and saved after I exited. Anybody see something similar ?

a System - JVM:INFOp=212f2e15,a='5.0.0.411',o='5.2.0.31',h=8400xxxx - 8/14 23:13:57 W net.rim.mango - TypeError: undefined is not a function.
Running  at line   16: a.shift().apply(e,f)}finally{.
Called from line   16: A.resolveWith(c,[e]),e.fn.trigger&&e(c).trigger("ready").unbind("ready")} }.
Called from line   16: c.removeEventListener("DOMContentLoaded",B,!1),e.ready()}.
 - 8/14 23:13:46
i net.rim.srp - 229831 - 8/14 23:13:43
E net.rim.srp - CNor - 8/14 23:13:43
E net.rim.srp - INcn - 8/14 23:13:43
a net.rim.tunnel - Clos-MagicRudyAPN.rim - 8/14 23:13:43
E net.rim.tcp - DNSx   7 - 8/14 23:13:43

 

Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

Think it breaks in the following code  (jQuery 1.6.2)

 

	// Handle when the DOM is ready
	ready: function( wait ) {
		// Either a released hold or an DOMready/load event and not yet ready
		if ( (wait === true && !--jQuery.readyWait) || (wait !== true && !jQuery.isReady) ) {
			// Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
			if ( !document.body ) {
				return setTimeout( jQuery.ready, 1 );
			}

			// Remember that the DOM is ready
			jQuery.isReady = true;

			// If a normal DOM Ready event fired, decrement, and wait if need be
			if ( wait !== true && --jQuery.readyWait > 0 ) {
				return;
			}

			// If there are functions bound, to execute
			readyList.resolveWith( document, [ jQuery ] );

			// Trigger any bound ready events
			if ( jQuery.fn.trigger ) {
				jQuery( document ).trigger( "ready" ).unbind( "ready" );
			}
		}
	},

 

seems to break @ .....trigger( "ready" ).unbind( "ready" )

Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

Running with un minimized jQuery 1.6.2 I get the following error log (on 8900 Curve OS5)

 

W net.rim.mango - TypeError: undefined is not a function.
Running  at line 1008: callbacks.shift().apply(context,args);} }finally{.
Called from line  436: readyList.resolveWith(document,[jQuery]);.
Called from line  915: jQuery.ready();}.

 

Retired
Posts: 518
Registered: ‎07-18-2011
My Device: Bold
My Carrier: Rogers

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

Hi Heiko,

 

According to this JQuery example 1.5.2 seems to be working on 5.0. DO you need a feature of 1.6.2, otherwise maybe try that library instead.



1.Please resolve your thread by clicking the "Accept as Solution" button below the post which solved your problem!
2. If any post helps you please click the button below the post(s)
Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

[ Edited ]

Thanx jeff

 

No I'm not aware of any specific features that I might need in 1.6.2. - as long as I can use the latest jQueryMobile (Beta 2)

 

I had tried 1.6.1 aswell and that also didn't work. 

Its a bit tedious to test since it only breaks on phone - and for each test I need to repackage and sign and upload and reboot.

And each time I sign I get between 10-40 emails ... is that normal  ? 

 

Will test with 1.5.2. and report back.

 

I was keen to follow up if this is a bug with the latest jQuery library - do I need to report this to jQuery development group ? 

 

PS: Alt-LGLG rocks ! Smiley Wink Well very helpful to get more info on phone. 

 

.H 

Developer
Posts: 125
Registered: ‎01-17-2011
My Device: Playbook
My Carrier: Vodacom

Re: jQuery Mobile app doesn't work on OS5 phone, but works in simulator

[ Edited ]

Ok tried 1.5.2 library and that works. 

 

Well the content displays, but doesn't look very nice in OS 5, looks more like unformatted html.

 

Also compiled the jQueryMobile sample app you mentioned - and that also works, but doesn't look anything like the sample screenshot -again its just unformatted html, hyperlinks (where buttons should be) and all the content of Pages 1-3 visible in 1 scrollable long section of html text

 

Looking at ALT-LGLG logs I found this error (after running the jQueryMobile sample on 8900 OS 5 Curve)

(sorry thats the debug info from the MINIMIZED jQuery 1.5.2)

 

net.rim.mango - TypeError: undefined is not a function.
Running  at line   16: b.clearAttributes(),b.mergeAttributes(a);.
Called from line   16: ba(f[h],g[h])}.
Called from line   16: e=e instanceof d?e[0]:e,k=e?e.ownerDocument||e:c,j=m.exec(a),j?d.isPlainObject(e)?(a=[c.createElement(j[1])],d.fn.attr.call(a,e,!0) ):a=[k.createElement(j[1])]:(j=d.buildFragment([g[1] ],[k]),a=(j.cacheable?d.clone(j.fragment):j.fragment).childNodes);.
Called from line   16: return new d.fn.init(a,b,g)}.
Called from line   16: var f={},h=a("<div id='jquery-mediatest'>"),i=a("<body>").append(h);.
Called from line   16: a.mobile.media=function(){var f={},h=a("<div id='jquery-mediatest'>"),i=a("<body>").append(h);return function(g){if(!(g in f) ){var j=document.createElement("style"),m="@media "+g+" { #jquery-mediatest { position:absolute; } }";j.type="text/css";if(j.styleSheet)j.styleSheet.cssText=m;else j.appendChild(document.createTextNode(m) );e.prepend(i).prepend(j);f[g]=h.css("position")==="absolute";i.add(j).remove()}return f[g]} }();.

 

Updated:

 

I ran software in 9300 simulator running BB OS 5 and took 2 screenshots of what if looks like in OS 5 - not what I was hoping for. (and also picked up on the same error when looking at the logs)

 

9300.jpg9300-01.jpg