Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JQuery Mobile + PhoneGap for Android - Error loading index.html

Tags:

I am trying to get a basic PhoneGap + JQuery Mobile program running for Android platform 2.2, but I am getting an Application Error "The Connection to the server was unsuccessful (file:///android_asset/www/index.html)" in the Android Emulator when I try to run the application in Android Emulator platform 2.2 on Windows XP, with Eclipse 3.7.

The file loads if I remove all references and syntax of JQuery Mobile from the HTML file, so I am certain that my project is fine but there's something I am missing with initialization of JQuery Mobile. I am using PhoneGap 0.9.6 with JQuery Mobile version *1.0b1* with JQuery version 1.6.1 (I also tried with JQM Version 1.0a2 with JQuery 1.4.4 but with the same error).

If I remove all references to JQuery Mobile from my HTML file then I am able to load the program in the emulator without errors.

I looked at several examples on the web and tried them as they are, but all of them show the same error. My files are as:

<!DOCTYPE HTML> <html>   <head>     <meta name="viewport" content="width=320; user-scalable=no" />     <meta http-equiv="Content-type" content="text/html; charset=utf-8">     <title>PhoneGap With JQM</title>       <link rel="stylesheet" href="jquery.mobile-1.0b1.min.css" type="text/css" charset="utf-8" />         <script src="jquery-1.6.1.min.js"></script>           <script type="text/javascript" charset="utf-8" src="phonegap.0.9.6.js"></script>           <script type="text/javascript" charset="utf-8" src="main.js"></script>             <script src="jquery.mobile-1.0b1.min.js"></script>    </head>   <body onload="init();">     <div data-role="page" data-theme="e">         <div data-role="header">             <h1>PhoneGap with JQM</h1>          </div>         <div data-role="content">             <h1>My Content</h1>           </div>         <div data-role="footer">             <h1>My Footer</h1>           </div>   </body> </html> 

The main.js file has only:

function init() {        document.addEventListener("deviceready", deviceInfo, true);              }        

What am I missing?

like image 407
Rags Avatar asked Jul 01 '11 07:07

Rags


1 Answers

The problem is likely due to the speed of the emulator so the network is too slow complete the communication in a timely fashion.

Set a 60 second timeout in PhoneGap by adding the following property to src/com/phonegap/xxx.java:

super.setIntegerProperty("loadUrlTimeoutValue", 60000);  

References:

phonegap 0.9.3 onReceivedError: Error code=-6 Description=The connection to the server was unsuccessful

http://The%20connection%20To%20The%20Server%20Was%20Unsuccessful%20-%20Android%202.2,%20jquerymobile,%200.9.5.1

like image 138
Moog Avatar answered Oct 11 '22 10:10

Moog