I'm having real trouble with PhoneGap in the iPhone with the events. The app is running pretty smooth in my android device, but on my iPhone it doesn't anything. For example, a simple code like this:
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0;" />
<meta charset="utf-8">
<title>WayAcross Mobile Application</title>
<link rel="stylesheet" href="css/jquery.css" />
<link rel="stylesheet" href="css/screen.css" />
<link rel="stylesheet" href="css/login.css" />
<script type="text/javascript" charset="utf-8" src="jquery/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery/jquery.mobile.js"></script>
<script type="text/javascript" charset="UTF-8" src="javascript/mainJavascript.js"></script>
<script type="text/javascript" charset="utf-8">
// Call onDeviceReady when PhoneGap is loaded.
//
// At this point, the document has loaded but phonegap.js has not.
// When PhoneGap is loaded and talking with the native device,
// it will call the event `deviceready`.
//
function onLoad(){
document.addEventListener("deviceready", onDeviceReady, false);
}
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
// Now safe to use the PhoneGap API
alert('ready');
}
</script>
<script type="text/javascript" charset="utf-8" src="javascript/phonegap.js"></script>
</head>
<body onload="onLoad()">
(this is a code example that doesn't work with iPhone and works with android).
I think its a problem with the events, but I'm not sure. Even the code examples in PhoneGap docs don't work. My environment is:
- Mac OSX 10.7.1
- Xcode 4.1
- PhoneGap 1.1
- jQuery Mobile 1.0RC The only thing that it shows me is this:
Thanks in Advance.
Regards,
Elkas
By the way, I've installed OSX Lion 10.7.2 and Xcode 4.2 now. Even in the IOS5 its not working. This is driving me crazy!!! Even with this simple code is not working.
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Device Ready Example</title>
<script type="text/javascript" charset="utf-8">
// Call onDeviceReady when PhoneGap is loaded.
//
// At this point, the document has loaded but phonegap.js has not.
// When PhoneGap is loaded and talking with the native device,
// it will call the event `deviceready`.
//
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
alert('Hello World');
}
</script>
<script type="text/javascript" charset="utf-8" src="javascript/phonegap.js"</script>
</head>
<body>
</body>
</html>
I'm having real trouble with PhoneGap in the iPhone with the events. The app is running pretty smooth in my android device, but on my iPhone it doesn't anything. For example, a simple code like this:
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0;" />
<meta charset="utf-8">
<title>WayAcross Mobile Application</title>
<link rel="stylesheet" href="css/jquery.css" />
<link rel="stylesheet" href="css/screen.css" />
<link rel="stylesheet" href="css/login.css" />
<script type="text/javascript" charset="utf-8" src="jquery/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery/jquery.mobile.js"></script>
<script type="text/javascript" charset="UTF-8" src="javascript/mainJavascript.js"></script>
<script type="text/javascript" charset="utf-8">
// Call onDeviceReady when PhoneGap is loaded.
//
// At this point, the document has loaded but phonegap.js has not.
// When PhoneGap is loaded and talking with the native device,
// it will call the event `deviceready`.
//
function onLoad(){
document.addEventListener("deviceready", onDeviceReady, false);
}
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
// Now safe to use the PhoneGap API
alert('ready');
}
</script>
<script type="text/javascript" charset="utf-8" src="javascript/phonegap.js"></script>
</head>
<body onload="onLoad()">
(this is a code example that doesn't work with iPhone and works with android).
I think its a problem with the events, but I'm not sure. Even the code examples in PhoneGap docs don't work. My environment is:
- Mac OSX 10.7.1
- Xcode 4.1
- PhoneGap 1.1
- jQuery Mobile 1.0RC The only thing that it shows me is this: http://cl.ly/0h462Y2D2F0J0B1B0q1M
Thanks in Advance.
Regards,
Elkas
By the way, I've installed OSX Lion 10.7.2 and Xcode 4.2 now. Even in the IOS5 its not working. This is driving me crazy!!! Even with this simple code is not working.
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Device Ready Example</title>
<script type="text/javascript" charset="utf-8">
// Call onDeviceReady when PhoneGap is loaded.
//
// At this point, the document has loaded but phonegap.js has not.
// When PhoneGap is loaded and talking with the native device,
// it will call the event `deviceready`.
//
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
alert('Hello World');
}
</script>
<script type="text/javascript" charset="utf-8" src="javascript/phonegap.js"</script>
</head>
<body>
</body>
</html>
- Everything looks okay there, try logging stuff using alert() to find out where it's failing. – sciritai Commented Oct 12, 2011 at 21:54
- Also try that. if I put onload="onDeviceReady()" in body tag or another function its showa the alert but the phonegap "events" still don't work. =( – Elkas Commented Oct 12, 2011 at 22:35
- jQuery mobile should be added after custom scripts. – Walf Commented Mar 8, 2012 at 1:45
5 Answers
Reset to default 1try putting the addevent listener under document.ready like this.. worked for me for the same problem.
$(document).ready(function(){
document.addEventListener("deviceready",function(){
},false);
});
Problem Solved!!
I run the application without the phonegap.js and it created me a new one. I just changed the name of it to the the one i was loading and the application finally works.
When creating a Phonegap installation for iOS a specific version of the (ie) phonegap.1.4.1.js is used.
Replacing just this file with a newer version (like cordova.1.8.0.js) resulted in alerts not working.
If you want to upgrade to a newer Phonegap version you will have to "redo" your project.
I reverted back to phonegap.1.4.1.js and the events magically started to work again.
Sort of a wild guess here, not sure how you pile this thing into an app but you list XCode so.... The markup points to script files in folder jquery/ and javascript/. When piling an app with XCode files are not placed in the actual folders that represent the group folders you normally use. In order for the files to actually end up in a directory inside the app you need to to add the folder on your harddrive as a folder reference (they show up as blue folders, not yellow).
The easiest way to check if this is the problem is to just remove the folder path of the script includes to just be the name of the file.
function testDialog() {
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
navigator.notification.alert("This is message", function(){}, "HaHa", "Done");
}
}