Using JQuery ajax to access a POST webservice

Question

I have implemented a Jersey web service and I want to access it using JQuery. It seems that ajax() method is what I need.

I've followed the suggestions found here but I keep getting an error and I don't know what to do next. The error that appears in the alert is [object Object]

I've already tested my web service using a Java client and the following curl command, and in both cases it is returning what I expect (actually the service just modifies one of the properties of the object and returns it, cause I'm just testing communication issues)

lorena@lorena-virtual-machine:~/tools$ echo $DATA
--data-binary {"endpoint":"endpoint","instance":null,"id":"idcube","schema":null}
lorena@lorena-virtual-machine:~/tools$ echo $HEADER
--header Content-Type:application/json
lorena@lorena-virtual-machine:~/tools$ echo $URL
http://localhost:8888/rest/cubes/get
lorena@lorena-virtual-machine:~/tools$ curl ${DATA} ${HEADER} ${URL}

Here is my html page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>QBplus: OLAP cubes in RDF</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

<script type="text/javascript"> 
$(function() {
var baseURL = "http://localhost:8888/rest/cubes/get";
var postData ={id:'cube1', endpoint:'myendpoint',schema:'a schema',instance:'some instance'};
var pdataJSON=JSON.stringify(postData);
$.ajax({
    type:'POST',
    url: baseURL,
    data:pdataJSON,
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    success: function (responseText) {
        alert(responseText.d);
    },
    error: function (error) {
        alert(error);
    }
});
});//ready
</script> 
</head>
<body>
  <h1>CUBES</h1>
   <div id="cubes"></div>
</body>

Any help would be appreciated!

regards,

Lorena

Apparently jQuery stringify gives problems in some browsers like IE7. Maybe you don't have to use it at all. — Stefan
– Stefan, Commented Jul 12, 2012 at 11:12
"but I keep getting an error and I don't know what to do next" What error are you getting? Post some details! — Anders
– Anders, Commented Jul 12, 2012 at 11:22
That is one of my problems @Anders. Using error: function(jqXHR, textStatus, errorThrown){ alert('error: ' + textStatus); } I just get error: error — lorenae
– lorenae, Commented Jul 12, 2012 at 12:11

PlTaylor · Accepted Answer · 2012-07-12 11:17:21Z

0

Placing a var in front of pdataJSON to initialize it should move you forward.

var pdataJSON=JSON.stringify(postData);

answered Jul 12, 2012 at 11:17

PlTaylor

7,60312 gold badges57 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

lorenae Over a year ago

yep, that's true. Var added, but still getting the same error

Suave Nti · Accepted Answer · 2012-07-12 11:29:44Z

0

Looks like you have problem with your data:

var postData ={id:'cube1', endpoint:'myendpoint',schema:'a schema',instance:'some   
 instance'};

replace with :

  var postData ={'id':'cube1', 'endpoint':'myendpoint','schema':'a 
  schema','instance':'some instance'};

Try this

   $.ajax({
    type: 'POST',
    contentType: 'application/json',
    url: rootURL,
    dataType: "json",
    data: JSON.stringify(postData);
    success: function(data){
        alert(data.responseText);

    },
    error: function(jqXHR, textStatus, errorThrown){
        alert('error: ' + textStatus);
    }
});

answered Jul 12, 2012 at 11:29

Suave Nti

3,76713 gold badges56 silver badges78 bronze badges

1 Comment

lorenae Over a year ago

Thanks @user1042031. I've followed your suggestions. I still get an error (Now the message is error: error, not very much information isn't it?)but now the request appears in Firebug Net perspective. The response headers seems to be ok but the response tab is empty

Collectives™ on Stack Overflow

Using JQuery ajax to access a POST webservice

2 Answers 2

1 Comment

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Linked

Related