Reputation: 3223
I'm new to phonegap and restful webservice. my question is how can i fuse the both of them so that i have an application that would sync with the restful webservice. i have tried a sample restful service with jsonp but phonegap doesn't loads the service or maybe i'm missing something. thank you.
Upvotes: 1
Views: 8706
Reputation: 13
I changed your ajax call slightly like this. We need to get the request posted. Also jquery.js should be first. Try to call device ready function too.
$.ajax({
url:'http://www.edumobile.org/blog/uploads/XML-parsing-data/Data.xml',
dataType:'xml',
type:'get',
cache: false,
Upvotes: 1
Reputation: 32273
It works the same as normal web project (using JSON):
$.ajax({
url: 'http://...',
type: 'POST',
dataType: 'json',
data: data,
success: : function(data) {
//...
},
error: function(xhr, textStatus, errorThrown) {
//...
},
beforeSend: function (xhr) {
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Accept', 'application/json');
}
});
The only difference is in PhoneGap you don't have to worry about same origin policy problems. That makes usage of JSONP not really necessary. Unless you are working with a server which only processes JSONP and not JSON.
Upvotes: 1
Reputation: 40503
The below code help you understand how to call a web service and and parse it to display the results
<html>
<head>
<script src="js/jquery-1.4.2.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script>
function bodyload(){
alert("We are calling jquery's ajax function and on success callback xml parsing are done");
$.ajax({
url:'http://www.edumobile.org/blog/uploads/XML-parsing-data/Data.xml',
dataType:'application/xml',
timeout:10000,
type:'POST',
success:function(data) {
$("#bookInFo").html("");
$("#bookInFo").append("<hr>");
$(data).find("Book").each(function () {
$("#bookInFo").append("<br> Name: " + $(this).find("name").text());
$("#bookInFo").append("<br> Address: " + $(this).find("address").text());
$("#bookInFo").append("<br> Country: " + $(this).find("country").text());
$("#bookInFo").append("<br><hr>");
});
},
error:function(XMLHttpRequest,textStatus, errorThrown) {
alert("Error status :"+textStatus);
alert("Error type :"+errorThrown);
alert("Error message :"+XMLHttpRequest.responseXML);
$( "#bookInFo" ).append( XMLHttpRequest.responseXML);
}
});
}
</script>
</head>
<body onload="bodyload()">
<button onclick="bodyload()">Ajax call</button>
<p id="bookInFo"></p>
</body>
</html>
Upvotes: 3