Clever Geek Handbook

JQuery Mobile + Phonegap: $ .ajax not working

I was looking for a solution but couldn't completely. The following codes work fine in jQuery 1.4.4, jQuery Mobile 1.0a2 and PhoneGap 0.9. However, when I submitted it to JQuery 1.7.1, JQuery Mobile 1.1.0 and PhoneGap 1.5; it keeps crashing under error. I tracked the http call through Fiddler and realized that ajax does indeed call the url, but why would it get caught in error instead of succeeding? Please, help!

$.ajax({
type: "GET",
cache: false,
url: updateServer+'update.xml',
dataType: "xml",
error: function(xhr, settings, exception){
    alert('The update server could not be contacted.');
},
success: function(xml){
    // success code     
    }
});
+3


source to share


4 answers


make sure you can access the web service from the emulator itself and allow the app to access the internet connection.



to do this, from inside the emulator, open your default browser and enter the url. it shouldn't give you 404 or exception.

+3


source


I am having a problem with Phonegap 1.5. Moving to Phonegap 1.4.1 solved the problem. I was disappointed for several days in a row and couldn't figure out the meaning of the problem.



+3


source


jQuery Mobile has an entire page in the documentation for embedding with PhoneGap. Check it out here.

http://jquerymobile.com/test/docs/pages/phonegap.html

You have to set permissions to allow cross-domain ajax calls.

Also! Don't forget to change your code in html files if you are migrating from a web app. You probably got url calls "../api/handler.php" or something. You must make all of these calls absolute for use in PhoneGap. "Http://mydomain.com/api/handler.php"

+1


source


Ok, I believe the problem is the URL itself. The url is valid as it is reachable, but it does not belong to the same domain. For example my html file with JQuery is at http://www.yahoo.com/index.html , but the url I'm trying to call is http://www.google.com .

Browser prevents ajax call from page hosted on one domain to page hosted on another domain (same origin policy) due to security issue. My solution here is to use a php file to fetch the relevant data from a different domain, while the html (with JQuery) calls the php file like this:



$.ajax({
type: "GET",
cache: false,
url: 'getcontent.xml',
dataType: "xml",
error: function(xhr, settings, exception){
    alert('The update server could not be contacted.');
},
success: function(xml){
    // success code     
    }
});

code>

Thanks for all the tips provided!

0


source






More articles:


All Articles