Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

Here is the HTML that contains javascript snippet in it:

<html>
<head>
<title>JSON</title>
<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js">
</script>

 <script language="javascript" type="text/javascript" >
 $(document).ready(function(){
     $("testButton").click(function() {
        $.ajax({
           type: "GET",
           dataType: 'jsonp',
           contentType: "application/jsonp; charset=utf-8",
           url: "http://localhost:4148/EIS.svc/getShipment/arun/arun",
           success: function (data) {
               obj = eval('(' + data + ')');
               alert(obj);
               var innerHtml = "";
               document.getElementById('test').innerHTML=obj;
                      //'test' is ID of <label1>
               document.getElementById('testlab').innerHTML=obj.shipmentDetails[0].Name;
                     //'testlab' is ID of <label2>
               $("#test").html(innerHtml);
               alert("JSON DATA");
               alert(obj.shipmentDetails[0].Number);
               },
               error: function (XMLHttpRequest, textStatus, errorThrown) {

                alert("Error while retrieval – " + XMLHttpRequest.responseText+":"+textStatus+":"+errorThrown);

                }

             });
         });
      });


</head>
<body>
<input type="button" id="testButton" value="GET JSON"/>
<label id="test"></label>
<label id="testlab"></label>
</body>
</html>

The JSON data returned by the WCF service URL in the browser is as follows:

{"shipmentDetails":[{"Name":"AAA","Number":"123"},{"Name":"BBB","Number":"321"}]}

When I was clicked the button there was no response in the browser and no errors shown in firebug.

Please help me out where I am making mistake.

Thank you.

share|improve this question
    
Is your local server also running on port 4148 or are you sure that the arun process is returning JSONP data? –  Andy Apr 11 '14 at 10:49

1 Answer 1

When using JSONP, the returned data should be wrapped in a callback function, like so:

myCallback({"shipmentDetails":[{"Name":"AAA","Number":"123"},{"Name":"BBB","Number":"321"}]})

Also, add the name of the callback to the jQuery ajax definition:

$.ajax({
   type: "GET",
   dataType: 'jsonp',
   contentType: "application/jsonp; charset=utf-8",
   url: "http://localhost:4148/EIS.svc/getShipment/arun/arun",
   [...]
   jsonpCallback: 'myCallback'
});
share|improve this answer
    
thank you @Borre.. can you please help me how to wrap the returned data in a callback function.. –  Arun Apr 11 '14 at 11:01
    
This should happen in the serverside code, similar to the first code block in my answer –  Borre Apr 11 '14 at 11:02
    
ok I will work on it.. –  Arun Apr 11 '14 at 11:10
    
can you please help me for the above task. –  Arun Apr 16 '14 at 6:01
    
I have finished the task for wrapping the returned data in the callback function. –  Arun Apr 16 '14 at 9:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.